JavaScript中this
是非常灵活的,也是在学习JavaScript
中的一个重要的点。下面主要从普通函数和箭头函数来解析this
。通过一个示例来加深理解
一 :对于对象中的函数即方法使用到this
,那么这个this
的值就是该对象的值。
二: JavaScript中的this
不受限制也就是说普通函数也能有this
,此时this
是在代码运行时被计算出来的,它取决于代码的上下文。如以下示例
一
"use strict";let user = {name: "xiaoming",sayHi:function(){console.log(this.name);}};let admin = {name: "laowang",sayHi:function(){console.log(this.name);}};user.sayHi();admin.sayHi();
输出
xiaoming
laowang
二
"use strict";function sayHi(){console.log(this.name);}let user = {name: "xiaoming",};let admin = {name: "laowang",};user.sayHi = sayHi;admin.sayHi = sayHi;user.sayHi();admin.sayHi();
输出
xiaoming
laowang
示例三参考第一个任务
箭头函数有些特别:它们没有自己的this
。如果我们在这样的函数中引用this
, this
的值取决于外部“正常的函数”。这句话可能有点难理解。箭头函数不会创建自己的this,所以它没有自己的this,它只会在自己作用域的上一层继承this
。所以箭头函数中this
的指向在它定义时以及确定了,之后不会被改变。
例子
"use strict";let user = {name: "tanglin",sayHi: function(){let arrow = ()=>{console.log(this.name);};arrow();}};user.sayHi();
输出
tanglin
理解
例子
"use strict";let user = {name: "tanglin",sayHi: ()=>{alert(this.name);}};user.sayHi();
输出
不能获取到想要的结果,此时的this 是 window 。疑问 按道理来说使用了 "use strict" this 应该是 undefined。但是我得到的结果确实是 window。mark一下。