[js]this和call.call

JavaScript 的一大特点是，函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概念。

https://www.cnblogs.com/coco1s/p/4833199.html

this即1,作用域 2,context 3,环境

//按照原型链查找机制往上级作用域找
    var name = 'maotai';
    var obj = {
        fn: function () {
            console.log(name);
        }
    };
    obj.fn();

//输出maotai

//this限制了执行环境
    var name = 'maotai';
    var obj = {
        fn: function () {
            console.log(this.name);
        }
    };
    obj.fn();

//undefined

但是我在学es6的时候

//对象不是作用域
// let a = 10;
// let obj = {
//     a: 20,
//     f: function () {
//         console.log(a);
//     }
// };
// obj.f();

call的使用规则

    function fn2() {
        console.log("fn2 this: " + this);
    }

    fn2.call(); //fn2 this: [object Window]

    function Fn(x, y) {
        console.log(arguments); //实参集,类数组
        console.log(this);
    }

    var obj = {'name': 'maotai'};
    Fn.call(obj, 1, 2);

Fn.call();          //window
Fn.call(null);      //window
Fn.call(undefined); //window
Fn.call(obj, 1, 2); //obj

把Fn放到obj环境执行.

• 例子1: Fn.call

    function Fn() {
        console.log(this.name);
    }
    var obj = {name:'maotai'};
    Fn.call(obj);//Fn中的this被改成了obj

• 例子2: 输出f2

    function f1() {
        console.log('f1');
    }

    function f2() {
        console.log('f2');
    }

    f2.call(f1); //输出f2

• 例子3: call.call
  
  https://juejin.im/post/5a11b77051882529642148ba

function fn1() {
    console.log("fn1 this: " + this);
}

function fn2() {
    console.log("fn2 this: " + this);
}

fn1.call.call.call(fn2);

1:这个方法是在哪开始执行的 call(fn2)

2:执行后的结果是什么 call(fn2) 前面的this 改成了fn2 前面方法照常执行

3:call(fn2) 前面是什么，改变this 后会怎样 call(fn2)
    前面是fn1.call 改变this后 由于fn1是这次的行为主体(this)，
    是他执行了call 方法，所以fn1 被call(fn2)变成了 fn2，所以接下来执行的就是 fn2.call()

4:输出 fn2 this: [object Window]

this的5种情况总结:

https://www.cnblogs.com/iiiiiher/articles/9813889.html

1. 点前是谁就是谁
2. 自执行函数
3. 获取元素节点
4. 回调函数
5. call,apply,bind