zoukankan      html  css  js  c++  java
  • 使用call、apply、bind继承及三者区别

    js里的继承方法有很多,比如:使用原型链的组合继承、es6的Class、寄生继承以及使用call、apply、bind继承。再说继承之前,我们先简单了解下它们的区别。

    一、区别:

    同:三者都是改变函数执行时的上下文,说人话就是改变this的指向。

    异:

    1、bind()返回的其实是一个函数,并不会立即执行。

    2、call()、apply()第二个参数有区别,call()的是一个值作为第二个参数,apply()的第二个参数则是一个数组:

            let obj = {
                name: 'jack'
            }
    
            function People(name) {
                this.name = name;
            }
    
            People.prototype = {
                sayHi(name) {
                    console.log(`Hi,${name}~`)
                }
            }
    
            let child = new People('rose');
    
             child.sayHi.call(obj, 'Sofia');
             child.sayHi.apply(obj, ['Sofia']);
    
             let bind = child.sayHi.bind(obj, 'Sofia');
             bind();

    二、继承

            let obj = {
                name: 'Sofia'
            }
    
            function People(name) {
                this.name = name;
            }
    
            People.prototype = {
                sayHi() {
               console.log(`Hi Jack,I am ${this.name}~`)
                }
            }  

    obj对象没有声明sayHi的方法,但是obj就是想跟帅哥杰克sayHi,并且告诉杰克她的芳名,但又不想声明sayHi方法,可不可以白嫖People这个构造函数里面的?当然可以。

            let child = new People('rose');
    
            child.sayHi.call(obj);
            child.sayHi.apply(obj);
    
            let bind = child.sayHi.bind(obj);
            bind();    

    调用child的sayHi,并且改变它的this的指向为obj。

  • 相关阅读:
    Fortran学习记录1(Fortran数据类型)
    ABAQUS学习记录1——用户子程序综述
    Abaqus用户子程序umat的学习
    信号基础知识---线阵
    信号基础知识--FFT DFT
    信号基础知识
    服务器文件打压缩包下载(java)
    网页鼠标特效-点击漂浮文字
    jQuery父子页面之间元素、方法获取、调用
    常用数字与字母的正则表达式
  • 原文地址:https://www.cnblogs.com/caoshufang/p/12907891.html
Copyright © 2011-2022 走看看