龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > Javascript编程 >

BAT及各大互联网公司2014前端笔试面试题--JavaScript篇(6)

时间:2014-11-04 11:03来源:网络整理 作者:网络 点击:
分享到:
复制代码 代码如下: function log(){ console.log.apply(console, arguments); }; 那么问题来了,apply和call方法的异同? 答案: 对于apply和call两者在作用上是相同的,即是

复制代码 代码如下:

function log(){
console.log.apply(console, arguments);
};  

那么问题来了,apply和call方法的异同?

答案:

  对于apply和call两者在作用上是相同的,即是调用一个对象的一个方法,以另一个对象替换当前对象。将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。
  但两者在参数上有区别的。对于第一个参数意义都一样,但对第二个参数: apply传入的是一个参数数组,也就是将多个参数组合成为一个数组传入,而call则作为call的参数传入(从第二个参数开始)。 如 func.call(func1,var1,var2,var3)对应的apply写法为:func.apply(func1,[var1,var2,var3]) 。

  9.在Javascript中什么是伪数组?如何将伪数组转化为标准数组?

  答案:

  伪数组(类数组):无法直接调用数组方法或期望length属性有什么特殊的行为,但仍可以对真正数组遍历方法来遍历它们。典型的是函数的argument参数,还有像调用getElementsByTagName,document.childNodes之类的,它们都返回NodeList对象都属于伪数组。可以使用Array.prototype.slice.call(fakeArray)将数组转化为真正的Array对象。
  假设接第八题题干,我们要给每个log方法添加一个"(app)"前缀,比如'hello world!' ->'(app)hello world!'。方法如下:

function log(){
    var args = Array.prototype.slice.call(arguments); //为了使用unshift数组方法,将argument转化为真正的数组
    args.unshift('(app)');
 
    console.log.apply(console, args);
   };

10.对作用域上下文和this的理解,看下列代码:

var User = {
 count: 1,

 getCount: function() {
  return this.count;
 }
};

console.log(User.getCount()); // what?

var func = User.getCount;
console.log(func()); // what?

问两处console输出什么?为什么?

  答案是1和undefined。

  func是在winodw的上下文中被执行的,所以会访问不到count属性。

  那么问题来了,如何确保Uesr总是能访问到func的上下文,即正确返回1。

  答案:正确的方法是使用Function.prototype.bind。兼容各个浏览器完整代码如下:

Function.prototype.bind = Function.prototype.bind || function(context){
  var self = this;

  return function(){
   return self.apply(context, arguments);
  };
}

var func = User.getCount.bind(User);
console.log(func());

11.原生JS的window.onload与Jquery的$(document).ready(function(){})有什么不同?如何用原生JS实现Jq的ready方法?

  window.onload()方法是必须等到页面内包括图片的所有元素加载完毕后才能执行。

  $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。

/*
 * 传递函数给whenReady()
 * 当文档解析完毕且为操作准备就绪时,函数作为document的方法调用
 */
var whenReady = (function() {        //这个函数返回whenReady()函数
  var funcs = [];       //当获得事件时,要运行的函数
  var ready = false;     //当触发事件处理程序时,切换为true
  
  //当文档就绪时,调用事件处理程序
  function handler(e) {
    if(ready) return;    //确保事件处理程序只完整运行一次
    
    //如果发生onreadystatechange事件,但其状态不是complete的话,那么文档尚未准备好
    if(e.type === 'onreadystatechange' && document.readyState !== 'complete') {
      return;
    }
    
    //运行所有注册函数
    //注意每次都要计算funcs.length
    //以防这些函数的调用可能会导致注册更多的函数
    for(var i=0; i<funcs.length; i++) {
      funcs[i].call(document);
    }
    //事件处理函数完整执行,切换ready状态, 并移除所有函数
    ready = true;
    funcs = null;
  }
  //为接收到的任何事件注册处理程序
  if(document.addEventListener) {
    document.addEventListener('DOMContentLoaded', handler, false);
    document.addEventListener('readystatechange', handler, false);      //IE9+
    window.addEventListener('load', handler, false);
  }else if(document.attachEvent) {
    document.attachEvent('onreadystatechange', handler);
    window.attachEvent('onload', handler);
  }
  //返回whenReady()函数
  return function whenReady(fn) {
    if(ready) { fn.call(document); }
    else { funcs.push(fn); }
  }
})();
精彩图集

赞助商链接