【读书笔记】读《JavaScript模式》 - 函数复用模式之现代继承模式

  现代继承模式可表述为:其他任何不需要以类的方式考虑得模式。

  现代继承方式#1 —— 原型继承之无类继承模式

function object(o) {

    function F() {};

    F.prototype = o;

    return new F();

}



function Person() {

    this.name = 'king';

}

Person.prototype.getName = function () {

    return this.name;

};



var papa = new Person();

var kid = object(papa);

console.log(kid.getName());    //king

  现代继承方式#2 —— 通过复制属性实现继承

/**

 * 1>包括深度复制和浅复制

 * 2>引深而来,引入“mix-in”(混入)模式,它并不是复制一个完整的对象,而是从多个对象中复制出任意的成员

 *     并将这些成员组合成一个新的对象。

 */

//浅复制

function extend(parent, child) {

    var i;

    child = child || {};

    for (i in parent) {

        if (parent.hasOwnProperty(i)) {

            child[i] = parent[i];

        }

    }

    return child;

}



//深度复制

function extendDeep(parent, child) {

    var i,

        toStr = Object.prototype.toString,

        astr = '[object Array]';

    

    child = child || {};

    

    for (i in parent) {

        if (parent.hasOwnProperty(i)) {

            if (typeof parent[i] === 'object') {

                child[i] = (toStr.call(parent[i]) === astr) ? [] : {};

                extendDeep(parent[i], child[i]);

            } else {

                child[i] = parent[i];

            }

        }

    }

    

    return child;

}

//测试深度复制

var dad = {

    counts: [1, 2, 3],

    reads: {paper: true}

};

var kid = extendDeep(dad);

kid.counts.push(4);

console.log(kid.counts.toString());    //1,2,3,4

console.log(dad.counts.toString());    //1,2,3

  现代继承方式#3 —— 借用方法

/**

 * 有时候,可能恰好仅仅需要现有对象其中的一个或两个方法。在想要重用这些方法的同时,但是又确实不希望与源对象形成父-子关系。

 * 也就是说,指向使用所需要的方法,而不希望继承所有哪些永远都不会用到的其他方法。

 * 这个时候,可以通过借用方法模式来实现,而这是收益与call()和apply()函数方法。

 * 同时,可以绑定函数的作用域。

 */

function f() {

    var args = [].slice.call(arguments, 1, 3);

    //同样可使用

    Array.prototype.slice.call(arguments, 1, 3);    //免于创建新数组了

    return args;

}

f(1, 2, 3, 4, 5, 6);    //2,3

  在上一篇文章中,介绍了函数复用模式之类式继承模式。两者全然阐述代码复用的模式,并形成鲜明对比。建议总是争取采用一种现代的继承模式,除非团队在不涉及到类的时候对此真的感到不适应。

  需要记住——代码重用才是最终目的,而继承知识实现这一目标的方法之一。

 

  源自:《JavaScript模式》

 

你可能感兴趣的:(JavaScript)