this详解

强调点:

this在任何情况下都不指向函数的词法作用域;
this的指向是在函数调用时确定的而不是在函数声明时确定的

this绑定规则(优先级由低到高)

1、默认绑定

函数调用类型: 独立函数调用

function foo() {
  console.log(this);
}

foo(); // global window...
2、隐式绑定

函数调用类型:obj.foo()

function foo() {
  console.log(this);
}

var obj = {
  foo: foo
}

obj.foo();

但是在隐式绑定中存在着隐式丢失绑定对象的情况

一种情况 
function foo() {console.log(this);}
 var obj = {foo: foo}
 var bar = obj.foo // 函数别名
 bar()  //调用位置在全局作用域下,为默认绑定 

另一种情况:函数作为参数传入时
function foo() {console.log(this);}
function doFoo(fn) {
  // fn其实引用的是foo
  fn(); // <--调用位置
}
var obj ={foo: foo}
doFoo(obj.foo);
3、显式绑定

call、apply、bind

4、new 绑定
var p = new Person();

var obj = {};   // 创建一个全新的对象
obj.__proto__ = Person.prototype;  // 这个新对象会被执行[[prototype]]连接
Person.call(obj);  // 这个新对象会绑定到函数的this
return obj; // 返回这个新对象
es6箭头函数中的this值不能被绑定,只属于外层(函数或全局)作用域
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 含义 既不指向函数本身,也不指向函数的词法作用域。 运行时动态绑定,并不是编写绑定,上下文取决于函数调用的各种条件...
    jweboy_biu阅读 274评论 0 0
  • 特别说明,为便于查阅,文章转自https://github.com/getify/You-Dont-Know-JS...
    杀破狼real阅读 708评论 0 1
  • 关于 this this 关键字是 JavaScript 中最复杂的机制之一。它是一个很特别的关键字,被自动定义在...
    游学者灬墨槿阅读 578评论 1 2
  • 一、你不知道的JavaScript 1、作用域 作用域 LHS RHS RHS查询与简单地查找某个变量的值别无二...
    顶儿响叮当阅读 349评论 0 0
  • 英文原文地址:All this翻译:姜乐衣 全局作用域下的this 在浏览器中,当this处于全局作用域时,thi...
    姜乐衣阅读 3,938评论 0 5