JavaScript中的劫持

1、对象的引用

var obj = {
            name: "karen",
            say: function () {
                console.log(this);
            }
        }
        var obj2 = {
            name: "jack"
        }
        obj2.fn = obj.say //函数可以被obj2访问也可以被obj访问
        obj2.fn()
        console.log(obj2);
        console.log(obj.say === obj2.fn); //同一个引用

运行结果：

2、this关键字的引用劫持

①this劫持1-call

 var obj = {
            name: "karen",
            say: function (str, arg) {
                console.log(this.name, str, arg);
            }
        }
        var obj2 = {
            name: "jack"
        }
        var obj3 = {
            name: "marry"
        }
        obj.say.call(obj2, 100, 200) //相当于obj2在调用say方法    
        obj.say.call(obj3, 80, 10)

运行结果：

this劫持2-apply

    var obj = {
            name: "karen",
            say: function (arg1, arg2) {
                console.log(this.name, arg1, arg2);
            }
        }
        var obj2 = {
            name: "jack"
        }
        var obj3 = {
            name: "marry"
        }
        obj.say.apply(obj2, [10, 20])//传数组
        obj.say.apply(obj3, [100, 200])

运行结果：

apply小案例

     var re = Math.max(10, 203, 35) //203
     var arr = [10, 24, 343, 53]
     var maxnum = Math.max.apply(0, arr) 
     console.log(maxnum);

    // var maxnum = Math.max.apply(0, arr)
    // 相当于假装0也有max方法
    // 0.max(10,230,40,6,2)==>230

运行结果：

this劫持3-bind

定义式的函数在设计的时候就指定this

    var obj2 = {
            name: "jack"
        }
        var obj = {
            name: "karen",
            say: function () {
                console.log(this);
            }.bind(obj2)
        }
        obj.say()
        var obj3 = {
            name: "marry"
        }
        
//call apply bind  bind优先级最高

//obj.say.call(obj3)
//obj.say.call(obj3, []) //bind优先级最高

//obj.say.call(obj2)
//1.所有的函数对象都有call方法---因为Function.prototype 有call方法
//2.obj.say.call(obj2) 运行的函数是say函数(哪个函数调call方法就是哪个函数运行)
//3.obj.say.call(obj2) 调用这个函数的对象是obj2(obj2调用say函数)

运行结果：

3、劫持扩展

    //obj.say.call(obj2)
    //1.所有的函数对象都有call方法---因为Function.prototype 有call方法
    //2.obj.say.call(obj2) 运行的函数是say函数(哪个函数调call方法就是哪个函数运行)
    //3.obj.say.call(obj2) 调用这个函数的对象是obj2(obj2调用say函数)

       function fn() {
            console.log(1);
        }

        function fn2() {
            console.log(2);
        }
        fn2.call()
        fn.call(fn2)
        fn.call.call(fn2) //fn2调用fn.call这个函数
        fn.call.call.call(fn2) //fn2调用fn.call.call这个函数

        Function.prototype.mycall = function (That, args) {
            //哪个函数调用mycall方法就是哪个函数运行
            // 调用这个函数的对象是That
            // this()//fn()
            var name1 = "hqyj_" + new Date()
            That[name1] = this
            var re = That[name1](args) //让传进来的对象去调用this函数
            delete That[name1]
            return re
        }
        obj.say.mycall(obj2, 100, 200)
        //等价于
        //obj2.say=obj.say
        //obj2.say(100,200)