封装,原型继承,类式继承

时间:2022-08-24 22:51:44

记一下笔记,关于js的封装和继承

 

//封装
var BOOK = (function () {
    var count = 0;
    return function (name) {
        function getCount() {
            return count++;
        }

        this.name = name;
        this.id = getCount();
    }
})();
BOOK.prototype.getName = function () {
    return this.name;
};

var book = new BOOK ('javascript');
console.log(book.id);
//console.log(book.getCount());  这会报错,因为getCount不可见,他不是实例上的方法
//所有没有用this定义的方法和属性,再实例中均不可访问
//上述代码中,id,name都是可以直接访问的,但是getCount在实例中无法访问
// 当然如果希望用getter和setter的话,只要将this.name变成name 然后getName必须定义在构造函数的内部
// 变成this.getName = function(){return name;} 即可(但是不能定义在prototype中


//类式继承

function Father (name){
    this.name = name;
}

Father.prototype.getName = function(){
    return this.name;
};

function Child (name, age){
    Father.call(this,name);  //利用call得到父类的属性
    this.age = age;
}

Child.prototype = new Father();
//prototype不是每一个对象都有的,函数具有prototype,但是每一个对象都有原型
//在查找是否存在属性或者方法的时候,现在自己里面找,找不到的时候会去寻找原型中的属性方法
//Father的实例中,可以访问到原型对象上的方法
//所以将child的原型设置为father的实例,就可以访问到father的方法
//Child.prototype = Father.prototype 这样配合call也能拿到正常情况下的全部信息
Child.prototype.constructor = Child;
//默认的prototype的constructor设置为Child本身,但是被覆盖后就没有了,这一步可以根据需要添加,如果不添加,在许多场合下也没有什么问题

var a = new Child('t','20');
console.log(a.getName());


//原型式继承

function clone (object){
    function F(){}
    F.prototype = object;
    return new F();
}

//这个father只是个对象,不是类
Father2= {
    id:1,
    fatherProperty: {
        name:'t2',
        age: 20
    }
};

child1 = clone(Father2);

//这个子对象也可以修改,但是如果修改一个子对象的话,还是留下全部的属性比较好

child1.fatherProperty.age=15;
console.log(child1.fatherProperty.name) // t2

//如果这样
child1.fatherProperty = {};
child1.fatherProperty.age=15;
console.log(child1.fatherProperty.name) // undefined

// 建议如下方式一起改

child1.fatherProperty = {
    name:'t2',
    age:25
};

相关文章