精华内容
下载资源
问答
  • apply call bind 改变 this指向,参数非必填。参数空,或者thisObj写入null,this指向window apply 参数: (thisObj,array); 修改this指向thisObj,原函数的参数封装到数组中传递。 函数.apply(null,[1,2]) call ...

    apply call bind 改变 this指向,参数非必填。参数空,或者thisObj写入null,this指向window

    • apply
      参数: (thisObj,array);
      修改this指向thisObj,原函数的参数封装到数组中传递。
      函数.apply(null,[1,2])
    • call
      参数: (thisObj,…*);
      修改this指向thisObj,原函数的参数已可变参数传递。
      函数.call (null,1,2)
    • bind
      {T} thisArg
      {… * } arg
      return {function(this:T)}
      Function.prototype.bind=function(thisArg,arg){}
      参数: (thisObj,…*);
      修改this指向thisObj,原函数的参数已可变参数传递。
      函数.bind(null,1,2)
         function Flower(name){
         	this.name=name;
         }
         Flower.prototype.sayName=function (){
         	console.info(this.name);
         }
    
         function Peony(name){
         	Flower.call(this,name);
         }
         Peony.prototype = new Flower();
    
         function Azalea(name){
         	Flower.call(this,name);
         }
         Peony.prototype = new Flower();
    
    
         var f=new Peony("牡丹");
         var t=new Azalea("杜鹃");
    
         f.sayName(); // 牡丹
         f.sayName.apply(t); // 杜鹃
    
    this.num = 888; // 变量,函数 默认指向 window
    var module = {
      num : 888888,
      getNum: function() { console.info(this.num); }
    };
    
    module.getNum(); // 返回 888888
    
    module.getNum.apply(window); // 返回 888
    module.getNum.apply(null); // 返回 888
    module.getNum.apply(); // 返回 888
    
    // 考点
    var viewNum = module.getNum;
    viewNum(); // 888  函数调用省略了window,实际是 window.viewNum();
    
    var reviewNum = viewNum.bind(module);
    reviewNum(); // 返回 888888  .bind(module);将this指向修改为module
    
    展开全文
  • 通过bind改变this指向

    2020-02-01 20:40:37
    function One(x,y) { console.log(this.age); // 100 console.log(this); // bind改变this指向 console.log(x+y); // 30 } function Two() { this.age=100; } var f2=new Two...
    function one(x, y, z) {
        console.log(this.age); // 改变指前是--undefined 改变后--100
        console.log(this); // 改变前--Window  改变后--Two
        console.log(x + y); // 改变前--NaN 改变后--30
        console.log(z); // 1
        return x + y + z;
    }
    function Two() {
        this.age = 100;
    }
    var two = new Two();
    var ff = one.bind(two, 10, 20);  // x 和 y 的值
    // var ff = one.bind(two); 
    // bind改变指向并不会直接调用,apply call是直接调用
    // 要想返回结果是函数,只能通过 bind改变指向
    console.log(ff(1));  // 这里传的是 z 的值  结果:31
    
    // 点击任意键
    document.onclick = function() {
        setTimeout(function() {
            console.log(this); // 此时的this是--Window  改变指向后--document
        }.bind(this), 100);
    }
    
    展开全文
  • call, apply,bind都可以改变this指向 区别: call只能一个参数一个参数的传入。 apply则只支持传入一个数组 至于bind方法,他是直接改变这个函数的this指向并且返回一个新的函数,之后再次调用这个函数的时候...

    call,  apply,bind都可以改变this指向

    区别

    call只能一个参数一个参数的传入。

    apply则只支持传入一个数组

    至于bind方法,他是直接改变这个函数的this指向并且返回一个新的函数,之后再次调用这个函数的时候this都是指向bind绑定的第一个参数。bind传餐方式跟call方法一致。

    列子:

    <script>
        //比方说张三的中饭有红烧鱼 李四的中饭有基围虾
        const person1 = {
            name: '张三',
            eat(...args) { //...args不限参数
                console.log(this.name + '吃张三的红烧鱼   和自己的' + [...args]);
            },
        }
    
        const person2 = {
            name: '李四',
            eat(...args) {
                console.log(this.name + '吃李四的基围虾    和自己的' + [...args]);
            },
        }
    
        person1.eat.call(person2, '白菜', '黄瓜') // 李四想吃张三的红烧鱼
        person2.eat.call(person1, '白菜', '黄瓜') // 张三也想吃李四的红烧鱼
    
        person1.eat.apply(person2, ['白菜', '黄瓜'])
        person2.eat.apply(person1, ['白菜', '黄瓜'])
    
    
        const test1 = person1.eat.bind(person2, '白菜', '黄瓜')
        const test2 = person2.eat.bind(person1, '白菜', '黄瓜')
        test1()
        test2()
    </script>

     

     

    <script>
        function Student(name, sex, age) {
            this.name = name;
            this.sex = sex;
            this.age = age;
        }
    
    
        function GradStudent(name, sex, age, course) {
            // Student.call(this, name, sex, age)
            Student.apply(this, [name, sex, age])
            this.course = course
        }
    
        var student = new Student('学生1', '女', '12');
        var grastudent = new GradStudent('学生2', '男', '18', '英文');
    
        console.log(student)
        console.log(grastudent)
    </script>

    总结一些,使用这种方法呢 ,改变this指向已达一个对象复用另一个对象里的方法

    展开全文
  • 优雅的改变this指向 call() bind() apply() call 字面意思呼叫 apply 是应用 bind是捆绑的意思 这个最特别也是我们最常用的 fun.call(thisArg,arg1,arg2,...) //第一个参数是把this指向谁,后面的是其他类型参数...

     

    优雅的改变this指向 call() bind() apply()

    call 字面意思呼叫  apply 是应用  bind是捆绑的意思 这个最特别也是我们最常用的

     

    fun.call(thisArg,arg1,arg2,...) //第一个参数是把this指向谁,后面的是其他类型参数

    // call的作用 1是调用函数 2是改变this指向

    // 主要作用是实现继承 在es5的时候

    function run(a,b) {
        console.log(this);
        console.log(a+b);
    }
    var o  = {
        name: 'zhangsan'
    }
    
    // run.call() //  这样也能调用函数,没有修改this指向
    // run.call(o) // 改变this指向为o
    run.call(o,1,2) 
    
    
    function Father(name, age) {
        this.name = name,
        this.age = age
    }
    function Son(name, age) {
        Father.call(this,name,age) //修改this指向为Son
    }
    
    var son = new Son('ldh',18)
    console.log(son); // Son {name: "ldh", age: 18}

     

    fun.apply(thisArg,[argsArg])  //第一个参数是把this指向谁,后面必须写成数组

    apply的作用 1是调用函数 2是改变this指向

    主要作用是如 对数组求最大值,数组本身没有求最大值得方法,但是Math有,我们通过apply改变下指向为Math

    展开全文
  • call和apply在改变this指向的时候会调用函数,bind不会调用函数 call和apply传递的参数不一样,call传递的参数用逗号隔开,apply传递的是数组 bind不会调用函数,但是会改变this指向 应用场景: call适用于继承 ...
  • apply和call改变this指向 apply和call方法也是函数的调用方式 apply和call如果没有传入参数,或者是传入的null,那么该方法的函数对象中的this就是默认的window apply和call传入参数的写法不一样,但是效果一样 ...
  • this指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象(这句话有些问题,后面会解释为什么会有问题,虽然网上大部分的文章都是这样说的,...
  • let info = { name: "Wang" } function people() { console.log("他叫" + this.name) } let func = people.bind(info); func();
  • 改变this指向三种方法 1,call方法 //1,call() let o = { name: 'red', } function fn(a, b) { console.log(this); console.log(a + b); } fn.call(o, 1, 2) //调用函数,改变this指向, 最前面的参数是改变...
  • 关于JavaScript中的this 1. 函数预编译过程this - >...函数调用中的this指向全局变量。 注:ECMAScript5的strict模式不存在全局变量,这里的this是undefined。 2. 全局作用域里this -> window...
  • this指向,一句话总结就是谁调用的就指向谁,那接下来我们就看下常见的函数调用方式: 1. 普通函数 function show() { console.log(this === window) // true } show() 普通函数的this默认指向的是window,因为...
  • 推荐非常浅显易懂的一片文章,搭配代码实例,易于理解!this与call… 首先我们先要明确一点: ...2. apply()主动执行,第一个参数为this指向的对象,第二参数为一个数组(类数组),数组里包含所有实参...
  • 改变this指向的原理要用到我们的第三种定义函数的方式: var Fn=new Function() 函数由Function构造器实例化这句话怎么去理解: 首先举个例子: var name = new Function() console.log(name) 输出的形式就是(也...
  • call,apply,bind相同点都是改变this指向,指向传入的thisObj的上下文环境。 不同点 对于第二个参数,call参数必须一一列举出来,apply传入的是一个argment对象或者数组,bindbind的返回值是函数;②后面的参数...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 36,886
精华内容 14,754
关键字:

bind改变this指向