标签：web name bind dog cat call eat

web前端必做笔记之一：call，apply，bind基本语法

call可以调用函数，call可以改变函数中this指向

<script>
            function fun(){
                   console.log("hello world");
            };

            // call可以调用函数，call可以改变函数中this指向
            fun.call()  // hello world;
</script>           

<script>
            function fun(){
                   console.log(this.name);
            };
            
            let  cat = {
                  name:"喵喵"
            }
            fun.call(cat)  让函数中的this指向cat,所以输出"喵喵"

           let dog = {
                  name:"旺财",
                  sayName(){
                         console.log("我是" + this.name);
                  }
           }
           dog.sayName(); //这样输出就是"我是旺财" 如果要实现输出"我是喵喵"？

           dog.sayName.call(cat); //这样就可以让猫去用狗的sayName,所以输出"我是喵喵"
</script>

           let dog = {
                  name:"旺财",
                  sayName(){
                         console.log("我是" + this.name);
                  },
                  eat(food){
                        console.log("我喜欢吃" + food)
                  }
           }

           dog.eat("骨头"); // 这个肯定输出我喜欢吃骨头，让猫来调
           dog.eat.call(cat); // 这里会会输出我喜欢吃undefined,因为这里我没有传参,那怎么传参呢？
           dog.eat.call(cat,"鱼"); //会输出我喜欢吃鱼， call的第一个参数是你要改变this的对象，往后的参数就是你要传的参数，call的参数就是你要给eat传的参数;
           //当我们要传两个参数呢？

           let dog = {
                  name:"旺财",
                  sayName(){
                         console.log("我是" + this.name);
                  },
                  eat(food1,food2){
                        console.log("我喜欢吃" + food1 + food2)
                  }
           }

           dog.eat.call(cat,"鱼","肉"); //这时会输出“我喜欢吃鱼肉”;
</script>

<script>
//apply用法, 与call相比传参的方式不同
      
       dog.eat.apply(cat,["鱼","肉"]); //这时会输出“我喜欢吃鱼肉”;

        //bind用法
       
        dog.eat.bind(cat,"鱼","肉");  //什么都没输出,为啥什么都没输出？

        //这就是bind和call的区别，bind不会调用这个函数，而call会调用这个函数
        //bind作用:它会把一个函数作为返回值返回出来，与call传参方式一样
        let  fun  = dog.eat.bind(cat,"鱼","肉");  //赋值给fun
             fun();  //"我喜欢吃鱼肉"
</script>

call，apply，bind基本语法总结：

  1.call和apply会调用函数，可以改变函数中this指向
     区别在于:传参的方式不同
  2.call和bind,传参的方式完全一样
     区别在于:call会直接调用，而bind它会作为一个返回值返回一个函数然后
                     才能够调用。

标签：web,name,bind,dog,cat,call,eat
来源： https://blog.csdn.net/qq_42302014/article/details/120618760

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。