• 前端开发面试题JS2


    21、如何判断一个对象是否属于某个类?

      使用instanceof

      if(a instanceof Person){

          alert('yes');

       }

    22、new操作符具体干了什么呢?

    (1)创建一个空对象,并且 this 变量引用该对象,同时还继承了该函数的原型。

    (2)属性和方法被加入到 this 引用的对象中。

    (3)新创建的对象由 this 所引用,并且最后隐式的返回 this 。

    var obj = {};

    obj.__proto__ = Base.prototype;

    Base.call(obj);

    23、Javascript中,有一个函数,执行时对象查找时,永远不会去查找原型,这个函数是?

    hasOwnProperty

    javaScript中hasOwnProperty函数方法是返回一个布尔值,指出一个对象是否具有指定名称的属性。此方法无法检查该对象的原型链中是否具有该属性;该属性必须是对象本身的一个成员。

    使用方法:

    object.hasOwnProperty(proName)

    其中参数object是必选项。一个对象的实例。

    proName是必选项。一个属性名称的字符串值。

    如果 object 具有指定名称的属性,那么JavaScript中hasOwnProperty函数方法返回 true,反之则返回 false。

    24、JSON 的了解?

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。

    它是基于JavaScript的一个子集。数据格式简单, 易于读写, 占用带宽小

    如:{"age":"12", "name":"back"}

    JSON字符串转换为JSON对象:

    var obj =eval('('+ str +')');

    var obj = str.parseJSON();

    var obj = JSON.parse(str);

    JSON对象转换为JSON字符串:

    var last=obj.toJSONString();

    var last=JSON.stringify(obj);

    [].forEach.call($$("*"),function(a){a.style.outline="1pxsolid #"+(~~(Math.random()*(1<<24))).toString(16)}) 能解释一下这段代码的意思吗?

    25、js延迟加载的方式有哪些?

    defer和async、动态创建DOM方式(用得最多)、按需异步载入js

    26、Ajax 是什么? 如何创建一个Ajax?

    ajax的全称:AsynchronousJavascript And XML。

    异步传输+js+xml。

    所谓异步,在这里简单地解释就是:向服务器发送请求的时候,我们不必等待结果,而是可以同时做其他的事情,等到有了结果它自己会根据设定进行后续操作,与此同时,页面是不会发生整页刷新的,提高了用户体验。

    (1)创建XMLHttpRequest对象,也就是创建一个异步调用对象

    (2)创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息

    (3)设置响应HTTP请求状态变化的函数

    (4)发送HTTP请求

    (5)获取异步调用返回的数据

    (6)使用JavaScript和DOM实现局部刷新

    27、Ajax 解决浏览器缓存问题?

    (1)在ajax发送请求前加上anyAjaxObj.setRequestHeader("If-Modified-Since","0")。

    (2)在ajax发送请求前加上anyAjaxObj.setRequestHeader("Cache-Control","no-cache")。

    (3)在URL后面加上一个随机数: "fresh=" + Math.random();。

    (4)在URL后面加上时间搓:"nowtime=" + new Date().getTime();。

    (5)如果是使用jQuery,直接这样就可以了 $.ajaxSetup({cache:false})。这样页面的所有ajax都会执行这条语句就是不需要保存缓存记录。

    28、同步和异步的区别?

    同步的概念应该是来自于OS中关于同步的概念:不同进程为协同完成某项工作而在先后次序上调整(通过阻塞,唤醒等方式).同步强调的是顺序性.谁先谁后.异步则不存在这种顺序性.

    同步:浏览器访问服务器请求,用户看得到页面刷新,重新发请求,等请求完,页面刷新,新内容出现,用户看到新内容,进行下一步操作。

    异步:浏览器访问服务器请求,用户正常操作,浏览器后端进行请求。等请求完,页面不刷新,新内容也会出现,用户看到新内容。

     

    29、如何解决跨域问题?

    jsonp、 iframe、window.name、window.postMessage、服务器上设置代理页面

    30、模块化开发怎么做?

    立即执行函数,不暴露私有成员

       var module1 = (function(){

        var_count = 0;

        var m1 =function(){

        //...

        };

        var m2 =function(){

        //...

        };

        return {

        m1 :m1,

        m2 : m2

        };

        })();

    31、AMD(Modules/Asynchronous-Definition)、CMD(CommonModule Definition)规范区别?

    Asynchronous Module Definition,异步模块定义,所有的模块将被异步加载,模块加载不影响后面语句运行。所有依赖某些模块的语句均放置在回调函数中。

     区别:

        (1) 对于依赖的模块,AMD 是提前执行,CMD 是延迟执行。不过RequireJS 从 2.0 开始,也改成可以延迟执行(根据写法不同,处理方式不同)。CMD 推崇 as lazy as possible.

        (2)CMD 推崇依赖就近,AMD 推崇依赖前置。看代码:

    // CMD

    define(function(require, exports, module) {

       var a = require('./a')

       a.doSomething()

       // 此处略去 100 行

       var b = require('./b') // 依赖可以就近书写

       b.doSomething()

       // ...

    })

    // AMD 默认推荐

    define(['./a', './b'], function(a, b) { // 依赖必须一开始就写好

       a.doSomething()

       // 此处略去 100 行

       b.doSomething()

       // ...

    })

    32、异步加载JS的方式有哪些?

      (1)defer,只支持IE

      (2)async:

      (3)创建script,插入到DOM中,加载完毕后callBack

    33、documen.write和 innerHTML的区别

    document.write只能重绘整个页面

    innerHTML可以重绘页面的一部分

    34、DOM操作——怎样添加、移除、移动、复制、创建和查找节点?

    (1)创建新节点

     createDocumentFragment()    //创建一个DOM片段

     createElement()   //创建一个具体的元素

     createTextNode()   //创建一个文本节点

    (2)添加、移除、替换、插入

     appendChild()

     removeChild()

     replaceChild()

     insertBefore() //在已有的子节点前插入一个新的子节点

    (3)查找

     getElementsByTagName()    //通过标签名称

     getElementsByName()    //通过元素的Name属性的值(IE容错能力较强,会得到一个数组,其中包括id等于name值的)

     getElementById()    //通过元素Id,唯一性

    35、.call() 和 .apply() 的区别?

      例子中用 add 来替换 sub,add.call(sub,3,1)== add(3,1) ,所以运行结果为:alert(4);

      注意:js 中的函数其实是对象,函数名是对 Function 对象的引用。

       function add(a,b)

        {

           alert(a+b);

        }

       function sub(a,b)

        {

           alert(a-b);

        }

       add.call(sub,3,1);

    36、jquery.extend 与jquery.fn.extend的区别?

    * jquery.extend 为jquery类添加类方法,可以理解为添加静态方法

    * jquery.fn.extend:

        源码中jquery.fn= jquery.prototype,所以对jquery.fn的扩展,就是为jquery类添加成员函数

    使用:

    jquery.extend扩展,需要通过jquery类来调用,而jquery.fn.extend扩展,所有jquery实例都可以直接调用。

    37、Jquery与jQuery UI 有啥区别?

    *jQuery是一个js库,主要提供的功能是选择器,属性修改和事件绑定等等。

    *jQuery UI则是在jQuery的基础上,利用jQuery的扩展性,设计的插件。

     提供了一些常用的界面元素,诸如对话框、拖动行为、改变大小行为等等

    38、jquery 中如何将数组转化为json字符串,然后再转化回来?

    jQuery中没有提供这个功能,所以你需要先编写两个jQuery的扩展:

       $.fn.stringifyArray = function(array) {

           return JSON.stringify(array)

        }

       $.fn.parseArray = function(array) {

           return JSON.parse(array)

        }

        然后调用:

       $("").stringifyArray(array)

    39、针对 jQuery 的优化方法?

    *基于Class的选择性的性能相对于Id选择器开销很大,因为需遍历所有DOM元素。

    *频繁操作的DOM,先缓存起来再操作。用Jquery的链式调用更好。

     比如:varstr=$("a").attr("href");

    *for (var i = size; i < arr.length; i++){}

     for 循环每一次循环都查找了数组(arr) 的.length 属性,在开始循环的时候设置一个变量来存储这个数字,可以让循环跑得更快:

     for(var i = size, length = arr.length; i < length; i++) {}

    40、如何判断当前脚本运行在浏览器还是node环境中?(阿里)

    this === window ? 'browser' : 'node';

    通过判断Global对象是否为window,如果不为window,当前脚本没有运行在浏览器中

    41、jQuery 的 slideUp动画 ,如果目标元素是被外部事件驱动, 当鼠标快速地连续触发外部元素事件, 动画会滞后的反复执行,该如何处理呢?

    jquery stop(): 如:$("#div").stop().animate({"100px"},100);

    42、那些操作会造成内存泄漏?

    内存泄漏指任何对象在您不再拥有或需要它之后仍然存在。

    垃圾回收器定期扫描对象,并计算引用了每个对象的其他对象的数量。如果一个对象的引用数量为 0(没有其他对象引用过该对象),或对该对象的惟一引用是循环的,那么该对象的内存即可回收。

    setTimeout 的第一个参数使用字符串而非函数的话,会引发内存泄漏。

    闭包、控制台日志、循环(在两个对象彼此引用且彼此保留时,就会产生一个循环)

    43、JQuery一个对象可以同时绑定多个事件,这是如何实现的?

    * 多个事件同一个函数:

       $("div").on("click mouseover", function(){});

    * 多个事件不同函数

       $("div").on({

           click: function(){},

           mouseover: function(){}

    });

    44、知道什么是webkit么? 知道怎么用浏览器的各种工具来调试和debug代码么?

    Chrome,Safari浏览器内核。

    45、用js实现千位分隔符?

    function commafy(num) {

       return num && num

           .toString()

           .replace(/(d)(?=(d{3})+.)/g, function($0, $1) {

               return $1 + ",";

           });

    }

    console.log(commafy(1234567.90));//1,234,567.90

    46、检测浏览器版本版本有哪些方式?

    功能检测、userAgent特征检测

    比如:navigator.userAgent

    //"Mozilla/5.0 (Macintosh; Intel MacOS X 10_10_2) AppleWebKit/537.36

     (KHTML, like Gecko) Chrome/41.0.2272.101 Safari/537.36"

    47、What is a Polyfill?

    polyfill 是“在旧版浏览器上复制标准 API 的 JavaScript 补充”,可以动态地加载JavaScript 代码或库,在不支持这些标准 API 的浏览器中模拟它们。

    例如,geolocation(地理位置)polyfill 可以在 navigator 对象上添加全局的 geolocation 对象,还能添加 getCurrentPosition 函数以及“坐标”回调对象,

    所有这些都是 W3C 地理位置 API 定义的对象和函数。因为 polyfill 模拟标准 API,所以能够以一种面向所有浏览器未来的方式针对这些 API 进行开发,

    一旦对这些 API 的支持变成绝对大多数,则可以方便地去掉 polyfill,无需做任何额外工作。

    48、做的项目中,有没有用过或自己实现一些polyfill 方案(兼容性处理方案)?

    比如: html5shiv、Geolocation、Placeholder

    49、使用JS实现获取文件扩展名?

    function getFileExtension(filename) {

     return filename.slice((filename.lastIndexOf(".") - 1>>> 0) + 2);

    }  

    String.lastIndexOf() 方法返回指定值(本例中的'.')在调用该方法的字符串中最后出现的位置,如果没找到则返回 -1。

    对于'filename'和'.hiddenfile',lastIndexOf的返回值分别为0和-1无符号右移操作符(»>) 将-1转换为4294967295,将-2转换为4294967294,这个方法可以保证边缘情况时文件名不变。

    String.prototype.slice() 从上面计算的索引处提取文件的扩展名。如果索引比文件名的长度大,结果为""。

  • 相关阅读:
    LCD1602的第一个显示程序
    我的8*8点阵led做螺旋流水灯
    RS232电平TTL电平转换器MAX232相关
    如何自定义silverlight的加载页面
    关于一个页面中多个silverlight应用程序通信的总结
    ComboBox小技巧
    学习和分享的人
    转: 高效时间管理-介绍GTD
    转载:PHPexcel学习笔记2
    转载:PHPexcel学习笔记
  • 原文地址:https://www.cnblogs.com/woodyliang/p/6120738.html
Copyright © 2020-2023  润新知