• Call、apply、bind的区别


    Call、apply、bind的区别

    基础

      var obj = {
                name: '小明',
                gender:"男",
                age: 18,
                say() {
                    console.log(this.name+","+this.gender+"今年"+this.age)
                }
            }
            obj.say()//小明,男今年18
            var xh ={
                name:"小红",
                gender:"女",
                age:18
            }
            obj.say.call(xh)//小红,女今年18
    		obj.say.apply(xh)//小红,女今年18
    		obj.say.bind(xh)()//小红,女今年18
    

    传参

        <script>
            var obj = {
                name: '小明',
                gender: "男",
                age: 18,
                say(shool, Grade) {
                    console.log(this.name + "," + this.gender + "今年" + this.age + "在" + shool + "上" + Grade)
                }
            }
            var xh = {
                name: "小红",
                gender: "女",
                age: 18
            }
            obj.say.call(xh, "高等中学", "九年级")//小红,女今年18在高等中学上九年级
            obj.say.apply(xh, ["高等中学", "九年级"])//小红,女今年18在高等中学上九年级
            obj.say.bind(xh)("高等中学", "七年级")//小红,女今年18在高等中学上七年级
            obj.say.bind(xh, "高等中学", "九年级")()//小红,女今年18在高等中学上九年级
        </script>
    

    总结

    • 语法
      • call:对象.call(要指的对象,"参数1","参数2")
      • apply:对象.apply(要指的对象,[参数1,参数2])
    • 相同点
      • 他们三者都是改变this的指向
      • 第一个参数都是this要指向的对象
      • 都可以后续传参
    • 不同点
      • call和apply都是对函数直接调用,bind方法返回的是一个函数需要()调用

      • call传递参数的时候是字符串对应传参,如:obj.say.call(xh, "高等中学", "九年级")

      • apply第二个参数是一个数组,如:obj.say.apply(xh, ["高等中学", "九年级"])

      • bind可以在调用处传参,如:obj.say.bind(xh)("高等中学", "七年级")

      • bind还可以向call一样传参,如:obj.say.bind(xh, "高等中学", "九年级")()

    作者:陌客

    本文版权归作者和博客园共有,欢迎转载!
    但必须给出原文链接,并保留此段声明,否则保留追究法律责任的权利。
  • 相关阅读:
    寻找完全数(C++)
    莱布尼兹三角形(C++)
    简单的素数问题(C++)
    ubuntu17.04下安装LNMP
    ubuntu下连接mysql出现Access denied for user 'rose'@'localhost' (using password: NO)的解决方法
    快速理解面向对象的PHP编程--基础篇
    百度电面总结
    操作系统基础知识
    快速理解C语言指针
    新手学习MongoDB的基本命令
  • 原文地址:https://www.cnblogs.com/AngelTp/p/12905866.html
Copyright © 2020-2023  润新知