一、 this的默认绑定
1.web全局环境下的this指向window
console.log(this) //window
2. 函数独立调用
非严格模式下,函数内部的this指向window
function fn(){
console.log(this)
}
fn() //window
window.fn()
严格模式下,为undefined
function fn(){
console.log(this)
}
fn() //undefined
3.被嵌套的函数独立调用时,this默认指向window
var obj = {
a: 2,
foo: function() {
function test() {
console.log(this); // window
}
test();
}
}
obj.foo();
4. 闭包中的this默认指向window
var obj3 = {
a: 2,
foo: function() {
console.log(this); // obj3
var c = this.a; // 2
return function test() {
console.log(this); // window
return c;
}
}
}
var fn = obj3.foo();
console.log(fn()); // 2
二、 箭头函数
箭头函数,那么会把this指向他的父级作用域
var num = 2
var obj = {
num:1,
fn:() => {
console.log(this.num); // 2
}
}
箭头函数的特点
- 没有构造函数,不能new实例对象
- 本身没有this指向,this指向父级
- 不能使用arguments
- 没有原型
箭头函数使表达更加简洁,隐式返回值
// 正常的写法
const isEven = function(n){
return n % 2 === 0;
}
const square = function(n){
return n * n;
}
const isEven = n => n % 2 === 0;
const square = n => n * n;
箭头函数的一个用处是简化回调函数
// 正常函数写法
[1,2,3].map(function (x) {
return x * x;
});
// 箭头函数写法
[1,2,3].map(x => x * x); //[1,4,9]
三、 call,apply,bind的区别
call,apply,bind主要作用都是改变this指向的,但使用上还是有区别的,说一下区别:
- call和apply 的 主要区别是在传递参数上不同,call后面传递的参数是以逗号的形式分开的,apply传递的参数是数组形式;
- bind 返回的是一个函数形式,如果要执行,则后面要再加一个小括号 例如:
- bind(obj,参数1,参数2)(),bind只能以逗号分割形式,不能是数组形式