Skip to content

Latest commit

 

History

History
122 lines (107 loc) · 3.52 KB

javascript继承方式思考.md

File metadata and controls

122 lines (107 loc) · 3.52 KB

YUI库实现继承的方式(利用构造函数实现继承)

function Animal(){}
Animal.prototype.species = "动物";

function Cat(name,color){
    this.name = name;
    this.color = color;
}

function extend(Child, Parent) {
    var F = function(){};
    F.prototype = Parent.prototype;
    Child.prototype = new F();
    Child.prototype.constructor = Child;
    Child.uber = Parent.prototype;
}
//使用方法
extend(Cat,Animal);
var cat1 = new Cat("大毛","黄色");
alert(cat1.species); // 动物

/*
  优点:节约内存,直接继承父类的原型属性;
  缺点:只能继承父类的原型中的属性,父类的原生属性不能继承;
*/




JQuery库实现继承的方式(利用非构造函数实现继承)

var Chinese = {
    nation:'中国',
    sayHi:function () {
        console.log("sayHi");
    }
};

var Doctor ={
    career:'医生'
};

//第一种方法:深拷贝,原生方法;
function deepCopy(p, c) {
    var c = c || {};
    for (var i in p) {
        if (typeof p[i] === 'object') {
            c[i] = (p[i].constructor === Array) ? [] : {};
            deepCopy(p[i], c[i]);
        } else {
            c[i] = p[i];
        }
    }
    return c;
};
Chinese.birthPlaces = ['北京','上海','香港'];
var Doctor = deepCopy(Chinese);
Doctor.birthPlaces.push('厦门');
alert(Doctor);
/*
  优点:能继承父类原生的东西;
  缺点:内存占用大,深继承;
*/


//第二种方法:object方法,集成;如果不支持就自己写原生的方法;
if (typeof Object.create != 'function') {
    alert("进来了!");
    // Production steps of ECMA-262, Edition 5, 15.2.3.5
    // Reference: http://es5.github.io/#x15.2.3.5
    Object.create = (function() {
        //为了节省内存,使用一个共享的构造器
        function Temp() {}

        // 使用 Object.prototype.hasOwnProperty 更安全的引用
        var hasOwn = Object.prototype.hasOwnProperty;

        return function (O) {
            // 1. 如果 O 不是 Object 或 null,抛出一个 TypeError 异常。
            if (typeof O != 'object') {
                throw TypeError('Object prototype may only be an Object or null');
            }

            // 2. 使创建的一个新的对象为 obj ,就和通过
            //    new Object() 表达式创建一个新对象一样,
            //    Object是标准内置的构造器名
            // 3. 设置 obj 的内部属性 [[Prototype]] 为 O。
            Temp.prototype = O;
            var obj = new Temp();
            Temp.prototype = null; // 不要保持一个 O 的杂散引用(a stray reference)...

            // 4. 如果存在参数 Properties ,而不是 undefined ,
            //    那么就把参数的自身属性添加到 obj 上,就像调用
            //    携带obj ,Properties两个参数的标准内置函数
            //    Object.defineProperties() 一样。
            if (arguments.length > 1) {
                // Object.defineProperties does ToObject on its first argument.
                var Properties = Object(arguments[1]);
                for (var prop in Properties) {
                    if (hasOwn.call(Properties, prop)) {
                        obj[prop] = Properties[prop];
                    }
                }
            }

            // 5. 返回 obj
            return obj;
        };
    })();
}
var teacher = Object.create(Chinese);
teacher.career = '医生';
alert(teacher.nation);
/*
  优点:js原生的方法,封装性好
  缺点:未知;
*/