JavaScript-对象本质

知识大纲：

1. 创建对象方式；
2. 构造函数；
3. 静态成员和实例成员；

1. 创建对象

1.1 new Object()创建对象

var person = new Object();//创建一个空对象
person.name = 'jack';
person.age = 18;

person.sayName = function(){
    console.log(this.name);
};

new Object()创建对象的语法糖方式——对象字面量：

以上代码等价于——

// var person = {};//创建一个空对象
var person = {
    name: 'jack',
    age: 18,
    sayName: function(){
        console.log(this.name);
    }
};

以上方式创建对象，实际上是通过内置的Object构造函数，new实例化对象。

• 函数与对象的关系？函数是对象，但对象都是通过函数创建的。
• 以上方式创建对象，可以作为工具使用、传递数据等。

1.2 优化new Object()创建多个相似对象代码冗余——工厂函数

工厂函数，用于解决创建多个相似对象的代码冗余问题:

function createPerson(name, age){
    return {
        name: name,
        age: age,
        sayName: function(){
            console.log(this.name);
        }
    };
}
var per1 = new Person('jack', 18);
var per2 = new Person('mike', 20);

工厂函数，解决了new Object()创建多个相似对象的代码冗余问题。但是创建的对象却不能识别其类型——

console.log(typeof p1);//object

 

1.3 构造函数实例化对象

function Person (name, age) {
    this.name = name
    this.age = age
    this.sayName = function () {
        console.log(this.name)
    }
}

var p1 = new Person('Jack', 18)
p1.sayName() // => Jack
var p2 = new Person('Mike', 23)
p2.sayName() // => Mike

构造函数实例化对象特点：

1. 使用构造函数实例化对象，可检测实例对象的类型。
2. 每个实例对象都含有constructor属性，指向创建该实例对象的构造函数。此属性可读、可写。

构造函数实例化对象过程：

1. new运算符开辟堆内存空间，在内存中新建一个对象。
2. 将构造函数的作用域赋给新对象，this指向新对象。
3. 新对象的内部原型指向构造函数的原型。
4. 将构造函数中的所有成员，拷贝一份存储在内存中。
5. 返回新对象。

检测实例对象的类型:

1. constructor属性，不严谨，不推荐。
2. instanceof运算符，推荐。

// constructor属性，可读可写，检测实例类型不严谨
console.log(p1.constructor === Person);//true
console.log(p2.constructor === Person);//true

// instanceof运算符，检测实例类型
console.log(p1 instanceof Person);//true
console.log(p2 instanceof Person);//true

/**
* Object.prototype.toString.call(thisobj);
* Object.prototype.toString.apply(thisobj);
* 推荐用于检测内置对象，不能检测自定义构造函数实例对象，检测:[object Object] 
*/
console.log(Object.prototype.toString.call(p1));//[object Object]

// typeof运算符，不能用于引用数据类型检测，检测始终是: object
console.log(typeof p1);//object

 

2. 静态成员和实例成员

2.1 静态成员

静态成员：能直接使用对象调用的成员。例如：Math对象中的成员属性、方法。

关于Math特点：

1. Math是内置对象。
2. Math不是构造函数。
3. Math不需实例化对象，可以直接调用成员。

//以下对象中的则是静态成员, 模拟内置Math对象
var Math = {
    PI: 3.1415926,
    abs: function(num){
        return num >= 0?num:-num;
    }
};

 

2.2 实例成员

实例成员: 构造函数中的成员。需实例化对象，才能调用构造函数中的成员。

// 以下则是实例成员
function Person (name, age) {
    this.name = name
    this.age = age
    this.sayName = function () {
        console.log(this.name)
    }
}