this指向运行时上下文
1.作为对象方法调用时,this指向对象本身
2.作为普通函数调用时,this指向父域。在全局作用域下调用,指向window。在函数内部调用,则指向父函数内部作用域
3.隐式调用时,则会丢到绑定对象。它会指向默认绑定,全局对象或者undefined。
function foo(){
console.log(this.a);
}
var obj ={
a:2,
foo:foo
};
var bar = obj.foo;
var a = "oops,global"
bar(); //oops,global
虽然bar是obj.foo的一个引用,但是实际上它引用的是foo函数本身,因此bar()其实是一个不带任何修饰的函数调用,此时this指向默认绑定。传参其实也是一个隐式调用,回调函数丢失this绑定是非常常见的。
4.call和apply、bind都动态地改变传入函数的this
apply bind call 改变作用域
const args = [].slice.call(arguments) //将类似Array的对象、集合转换为新的
apply和call都是为了改变函数运行时的上下文。即改变函数体类的this指向。apply和call调用时立即执行这个函数。
例如获取document的某子节点列表,这个节点时没有Array.slice 等方法。那么此时 使用Array.prototype.slice.apply 或者call就能实现slice截取功能。
bind 可以让对应函数在任何想调用的时候调用。并返回一个新的函数。在执行时添加参数。
apply的所有参数必须在一个数组中。
如果你传入了一个原始值(字符串类型、 布尔类型或者数字类型) 来当作 this 的绑定对 象, 这个原始值会被转换成它的对象形式(也就是
new String(…)、 new Boolean(…) 或者 new Number(…))。 这通常被称为“装箱”。
5.API调用时的上下文
第三方库的许多函数, 以及 JavaScript 语言和宿主环境中许多新的内置函数, 都提供了一个可选的参数, 通常被称为“上下文”(context), 其作用和 bind(…) 一样, 确保你的回调函数使用指定的 this。
6.构造器调用
使用new来调用函数时,新对象会绑定到函数调用的this。默认情况下,new返回的是this对象。
new 调用函数
- 创建(或者说构造)一个全新的对象
- 这个对象会被执行【原型】连接
- 这个新对象会绑定到函数调用的this
- 如果函数没有返回其他对象,那么new表达式中的函数调用会自动返回这个新对象