this

2016-09-27 本文已影响21人块垒

apply、call 有什么作用，什么区别

首先要引入this这个概念
由于运行期绑定的特性，this的含义非常多，既可以是全局对性爱那个，当前对象或任意对象，这取决于函数的调用方式，但总有一个原则，那就是this指的是调用函数的那个对象。

作为函数调用：在函数直接调用时this绑定到全局对象，在浏览器中，window就是该全局对象。
内部函数：函数嵌套产生的内部函数的this不是其父函数，仍是全局变量。
setTimeout、setinterval：这两个方法执行的函数this也是全局对象
作为构造函数调用：所谓构造函数，就是通过这个函数生成一个新对象。这时，this就指这个新对象。
new 运算符接受一个函数 F 及其参数：new F(arguments...)。这一过程分为三步：
1. 创建类的实例。这步是把一个空的对象的 proto 属性设置为 F.prototype 。
2. 初始化实例。函数 F 被传入参数并调用，关键字 this 被设定为该实例。
3. 返回实例。
作为对象方法调用：在JS中，函数也是对象，因此函数可以作为一个对象的属性，此时该函数被称为该对象的方法，在使用这种调用方法时，this被自然绑定到该对象。
DOM对象绑定事件：在事件处理程序中this代表事件源DOM对象（低版本IE被指向了window）

apply、call的作用
apply、call的作用是相同的，都是指定函数的this和参数来调用函数，使用call和apply可以使this的指向变得清晰。
apply、call的区别
apply接受的是数组形式的参数，call接受的是多个参数。

代码

以下代码输出什么？

var john = { 
  firstName: "John" 
}
function func() { 
  alert(this.firstName + ": hi!")
}
john.sayHi = func
john.sayHi()

输出john：hi！

下面代码输出什么，为什么

func() 
function func() { 
  alert(this)
}

输出window，因为函数是全局作用域下调用的

下面代码输出什么

function fn0(){
    function fn(){
        console.log(this);
    }
    fn();
}
fn0(); //输出window
document.addEventListener('click', function(e){
    console.log(this); //输出document节点
    setTimeout(function(){
        console.log(this); //输出window
    }, 200); 
}, false);

下面代码输出什么，why

var john = { 
  firstName: "John" 
}
function func() { 
  alert( this.firstName )
}
func.call(john)

输出John，因为通过call把this指为了john对象

代码输出？

var john = { 
  firstName: "John",
  surname: "Smith"
}
function func(a, b) { 
  alert( this[a] + ' ' + this[b] )
}
func.call(john, 'firstName', 'surname')

输出John Smith

以下代码有什么问题，如何修改

var module= {
    bind: function(){
      var cur=this; //添加
      $btn.on('click', function(){
        console.log(this) //this指什么
        cur.showMsg();//改
      })
    },
    showMsg: function(){
     console.log('饥人谷');
    }
}

在DOM绑定事件中this被指向了事件源DOM对象，所以this.showMsg()无法正常调用

this

apply、call 有什么作用，什么区别

代码

猜你喜欢

热点阅读