this 指向 及 调用方式

1. this 指向    结合箭头函数的this分析

函数执行方式 this指向
1.直接圆括号 window
2.对象调用 对象
3.事件触发 触发对象
4.定时器运行 window (常常定义变量存储this以达到this指向特定对象)
5.作为数组对象的某个元素 该数组对象

调用一个函数将暂停当前函数的执行,
传递控制权和参数给新函数,
除此之外,每个函数接收两个附加的参数:this 和 arguments。
this的值取决于调用的模式。

立即执行函数中的this指向window,因为立即执行函数是window调用的 

经典面试题:

var num = 1;
var myObject = {
    num: 2,
    add: function() {
        this.num = 3;
        (function() {
            console.log(this.num);
            this.num = 4;
        })();
        console.log(this.num);
    },
    sub: function() {
        console.log(this.num)
    }
}
myObject.add();
console.log(myObject.num);
console.log(num);
var sub = myObject.sub;
sub();

// 1   3   3   4    4
View Code

2. 调用方式

js中的四种调用模式: 方法调用模式 函数调用模式 构造器调用模式 apply 调用模式。

方法调用模式:
方法,当一个函数被保存为对象的一个属性时,称此函数为一个方法。
当一个方法被调用时,this被绑定到该对象,
如果一个调用表达式包含一个属性存取表达式(即 . 表达式 或者 [funName]表达式),
那么它被当作一个方法来调用。
通过 this 可取得它所属对象的上下文的方法 称为公共方法。

函数调用模式:
当一个函数并非一个对象的属性时,那么它被当作一个函数来调用。
函数调用模式下,this被绑定到全局对象。(
语言设计上的失误,
若设计正确,当内部函数被调用时, this 应该仍然绑定到外部函数
的 this 变量。解决方案:var that = this ;即缓存当前对象。

构造器调用模式
在一个函数前面带上 new 来调用,
将创建一个隐藏连接到该函数的 prototype 成员的新对象,
同时 this 也会被绑定到那个新对象上。
简而言之,结合 new 前缀调用的函数称为构造器函数(通常首字母大写)


apply调用模式(call)
js是一个 函数式的 面向对象的 编程语言,
所以函数可以拥有方法,可以有 apply 方法。
apply方法原理是劫持一个函数的属性和方法,加之在一个拥有arr参数的相同环境使用
(变相继承、扩展参数)

语言设计上的失误,
arguments 并不是一个真正的数值,有 length 属性,可通过下标获取对应元素,
但,它缺少所有数组方法。

2.1 es6 新增 箭头函数     外层(函数或者全局)作用域(词法作用域)来决定this。

function foo() {
    // return (a) => {
    //     console.log( this.a );
    // };

    // 2

    return function(a){
       console.log( this.a );
    }

    // 3
}

var obj1 = {
    a: 2
};

var obj2 = {
    a: 3
}

var bar = foo.call( obj1 );
bar.call( obj2 ); 
View Code
原文地址:https://www.cnblogs.com/justSmile2/p/10764098.html