JavaScript建立对象方式总结

今天阅读了JavaScript高级程序设计的第6章,关于对象建立的方式,这里作下总结,巩固下知识javascript

JavaScript建立对象的五种方式:java

1、经过字面量或Object构造函数建立

一、示例:编程

// 经过Object构造函数来建立
var person = new Object();
person.name = "mary";
person.age = 28;
person.sayHello = function() {
    alert(this.name + "say hello world");
}

console.log(person.constructor.name);    // Object


// 经过字面量来建立
var person = {
    name: "mary",
    age: 28,
    sayHello: function() {
        alert(this.name + "say hello world");
    }
}

console.log(person.constructor.name);    // Object

 

二、优势:简单灵活数组

三、缺点:函数

1)没法识别对象类型,经过person.constructor属性(该属性是从Object.prototype中继承来的)能够看到,无论是经过构造函数,仍是字面量(底层也是使用new Object来建立对象的),对象构造器属性均为Object。this

2)每次建立相同对象须要写大量的重复代码,每建立一个对象均须要重复的书写name、age、sayHellospa

 

 2、经过工厂模式建立

一、示例:prototype

function createPerson(name, age) {
    var person = new Object();
    person.name = name;
    person.age = age;
    person.sayHello = function() {
        alert(this.name + "say hello world");
    }
    return person;
}

var person = createPerson("mary",28);
console.log(person.constructor.name);    // Object

二、优势:不用每次建立对象时,都写一批重复的代码(经过字面量建立的),也就是建立对象的时候原先须要数行才能完成的工做,如今只须要一行便可设计

三、缺点:仍然没法识别对象的类型,建立的对象构造器指向的函数仍然都是Objectcode

 

 3、经过构造函数模式建立

一、示例:

function Person(name, age) {
    this.name = name;
    this.age = age;
    this.sayHello = function() {
        alert(this.name + "say hello world");
    }
}

var person = new Person("mary", 28);
console.log(person.constructor.name);    // Person

二、优势:能够识别对象的类型,person实例的constructor属性指向构造函数Person,也就解决了对象的识别问题

三、缺点:每次建立对象时,都实例化对象的属性,其中sayHello为函数对象,这将致使相同功能的代码,重复多余的建立对象,进而产生大量的内存浪费

 

 4、经过原型模式建立

一、示例

function Person() {}

Person.prototype.name = "mary";
Person.prototype.age = 28;
Person.sayHello = function() {
    alert(this.name + "say hello world");
}

var person = new Person();

二、优势:每次实例化对象时,仅在对象首次建立时,初始化原型对象,也就是sayHello函数对象仅建立一次,节省了很多内存资源

三、缺点:全部的实例对象共享原型对象的属性,若是原型对象中包含对象的引用,其中一个实例改变了引用对象的值,将影响到其它全部的实例对象

function Person() {
}

Person.prototype.books = ["Java编程思想", "JavaScript权威指南"];
Person.prototype.name = "person";

var mary = new Person();
mary.books.push("JavaScript高级程序设计");
mary.name = "mary";
console.log(mary.books);    // ["Java编程思想", "JavaScript权威指南", "JavaScript高级程序设计"]
console.log(mary.name);     // mary


var tony = new Person();
console.log(tony.books);    // ["Java编程思想", "JavaScript权威指南", "JavaScript高级程序设计"]
console.log(tony.name);     // person

能够看到Person的原型对象中定义了一个数组引用属性和字符串属性,当mary实例更改了数组引用属性的值时,tony实例的属性也被更改了,但当mary对象更改name属性时,却不影响tony实例,由于至关于mary本身从新定义了name属性

 

 5、动态原型模式

一、示例:

function Person(name) {
    this.name = name;
    if(typeof this.sayHello != "function") {
        console.log("init person prototype property");
        Person.prototype.sayHello = function() {
            alert(this.name + "say hello");
        }
    }
}

var mary = new Person("mary");
var tony = new Person("tony");

// init person prototype property

二、优势:有过相似java面向对象语言经验的,会以为javascript的原型模式建立对象语法很怪,写法松散,这样咱们能够采用动态原型模式,将构造函数的原型代码书写在构造函数内部,经过判断语句,来保证仅在第一次调用构造函数的时候,初始化对象。

三、缺点:构造函数中的代码变得略复杂

相关文章
相关标签/搜索