码迷,mamicode.com
首页 > 移动开发 > 详细

使用call、apply、bind继承及三者区别

时间:2020-05-18 00:57:01      阅读:661      评论:0      收藏:0      [点我收藏+]

标签:color   函数   ons   pre   原型链   参数   new   方法   很多   

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。

使用call、apply、bind继承及三者区别

标签:color   函数   ons   pre   原型链   参数   new   方法   很多   

原文地址:https://www.cnblogs.com/caoshufang/p/12907891.html

(1)
(1)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!