JavaScript面向对象总结

Posted 2020-10-13

　　对象(Object)应该算是js中最为重要的部分，也是js中非常难懂晦涩的一部分。更是面试以及框架设计中各出没。本文章，主要参考javascript红宝书（JavaScript高级程序设计 第六章）以及各大博主博客

谈谈对象属性的特性

　　毕竟是面向对象编程，我们在讨论如何面向对象之前先讨论讨论对象具有哪些属性和特性。

属性类型

　　简单的说，对象拥有四个属性:

• [[Configurable]]:是否可以通过delete删除，能否修改属性的特性。直白点：是否可配置
• [[Enumerable]]:枚举性，表示是否可以通过for-in循环返回
• [[Writable]]:可写性：是否可以修改属性的值
• [[Value]]:包含属性的值，也就是对应的可读性。 以上四个对象的属性的属性类型默认值分别为：true,true,true,undefined。

　　如果要修改属性默认的特性，必须通过Object.defineProperty()方法。大致如下：

var animal = {};
Object.defineProperty(animal,"name",{
    writable:false,
    value: ‘dog‘
});
console.log(animal.name);//dog
animal.name = ‘cat‘;
console.log(animal.name);//dog

　　writable:false，表示不可更改属性的值。从上面的实例可以看出，在调用Object.defineProperty()方法后，如果不指定 configurable、enumerable、writable 特性的值时，默认为FALSE。

访问器属性

　　访问器属性不包含数据值，但是包含getter和setter函数。在读取访问器属性时，会调用getter函数，这个函数负责返回有效值。在写入访问器属性时，回到用setter函数并传入新值。

• [[Configurable]]:表示是否可以通过delete删除。默认为TRUE
• [[Enumerable]]:同上面介绍的Enumerable一样，默认为true
• [[Get]]:读取数据时候调用的方法。默认为undefined
• [[Set]]:在写入属性值得时候默认调用的方法。默认为undefined

　　这里不做过多解释，直接看例子吧（来自js红宝书）

var book = {
    _year:2012,
    edition:1
};
Object.defineProperty(book, ‘year‘,{
    get:function(){
        return this._year
    },
    set:function(value){
        if(value>2012){
            this._year = value,
            this.edition++
        }
    }
});

book.year = 2013;
console.log(book.edition);//2

　　其实对于多个属性的定义，我们可以使用Object.defineProperties方法。然后对于读取属性的特性我们可以使用Object.getOwnPropertyDescriptor()方法。

创建对象

　　创建对象，我们不是直接可以通过Object的构造函数或者对象字面量的方法来实现对象的创建嘛？当然，这些方法是可以的，但是有一个明显的缺点：使用同一个接口创建很多对象，产生大量重复的代码。所以这里，我们使用如下的一些操作

工厂模式

　　一种很基础的设计模式，简而言之就是用函数来封装以特定接口创建对象的细节。

function createAnimal(name,type){
    var o = new Object();
    o.name = name;
    o.type = type;
    o.sayName = function(){
        alert(this.name)
    }
    return o;
}
var cat = createAnimal(‘小猫‘,‘cat‘);
var dog = createAnimal(‘小狗‘,‘dog‘);