js对象之创建

1. js的对象创建有4种：

　　第1种： 原始模式　　

　　　　var cat = {};　　//先创建空值

　　　　cat.name = '黑豆';　　//创建属性name并赋值

　　　　cat.color = 'black';　　//创建属性color并赋值

　　　　console.log(cat.name);　　//黑豆

　　　　console.log(cat.color);　　//black

　　第2种： 原始模式

　　　　var cat = {　　//创建对象

　　　　　　name : '黑豆',　　//创建属性name并赋值

　　　　　　color : 'black'　　//创建属性color并赋值

　　　　}

　　　　console.log(cat.name+cat.color);　　//黑豆black

　　第3种： 原始模式的改进：通过创建并调用函数创建对象

　　　　function Cat(name, color) {　　//创建函数

　　　　　　return {

　　　　　　　　name : name,　　//传入的参数赋值给name

　　　　　　　　color : color　　//传入的参数赋值给color

　　　　　　}

　　　　}

　　　　var cat1 = Cat('黑豆', 'black');　　//创建对象同时初始化属性值

　　　　console.log(cat1.name+cat1.color);　　//黑豆black

　　第4种： 构造函数模式，实际上就是普通函数内部使用了this变量，对构造函数使用new运算符，就能生成实例对象 （important）

　　　　function Cat(name, color) {　　//创建函数

　　　　　　this.name = name,　　//传入的参数赋值给name

　　　　　　this.color = color　　//传入的参数赋值给color

　　　　}

　　　　var cat1 = new Cat('黑豆', 'black');　　//创建对象cat1并初始化属性值

　　　　var cat2 = new Cat('皮皮', 'yellow');　　//创建对象cat2并初始化属性值

　　　　console.log(cat1.name+cat2.name);　　//黑豆皮皮

　　　　cat1和cat2对象内部含有一个constructor属性，指向他们的构造函数

　　　　console.log(cat1.constructor == Cat);　　//true

　　　　console.log(cat1.constructor == Cat);　　//true

　　　　Js还提供了一个instanceof运算符，验证原型对象与实例对象之间的关系。　

　　　　alert(cat1 instanceof Cat); 　　//true

 

　　　　alert(cat2 instanceof Cat); 　　//true

 

2. js构造函数的一些使用：

　　1.构造函数方法很好用，但是存在一个浪费内存的问题，我们给Cat对象添加一个不变的属性type和方法eat

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

　　　　　　this.color = color,

　　　　　　this.type = '小动物',

　　　　　　this.eat = function() {console.log('吃狗粮');}

　　　　}

　　　　同样的方法生成Cat的实例

　　　　var cat1 = new Cat('黑豆', 'black');

　　　　var cat2 = new Cat('皮皮', 'yellow');

　　　　console.log(cat1.name+cat1.type);　　//黑豆小动物

　　　　cat1.eat();　　//吃狗粮

　　　　表面上看好像没有什么问题，但是当我们生成多个Cat的对象的时候，type属性和eat方法（）都是一模一样的内容，是重复的过程，还占用内存空间，并且影响效率

　　　　console.log(cat1.eat == cat2.eat);　　//false 说明他们指向不同的内存地址

　　2.解决办法： js规定： 每个构造函数都有一个prototype属性，指向另一个对象，这个对象的所有属性和方法，都会被构造函数的实例所继承

　　　　这说明： 我们可以把那些不变的属性和方法，定义在prototype上面

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

 

　　　　　　this.color = color

 

　　　　}

　　　　Cat.prototype.type = '小动物';

 

　　　　Cat.prototype.eat = function() {console.log('吃狗粮');}

　　　　生成实例

　　　　var cat1 = new Cat('黑豆', 'black');

 

　　　　var cat2 = new Cat('皮皮', 'yellow');

 

　　　　console.log(cat1.eat == cat2.eat);　　//true 说明他们指向的是同一个内存地址

　　3.一些判断关系的api（以上面构造和对象为例）

　　　　判断属性是本地属性还是prototye的属性（.hasOwnProperty）

　　　　console.log(cat1.hasOwnProperty('name'));　　//true 是本地属性，构造函数自带属性

　　　　console.log(cat1.hasOwnProperty('type'));　　//false 不是本地属性，是prototype所带属性

　　　　判断prototype原型和实例之间的关系（.isPrototypeOf）

　　　　console.log(Cat.prototype.isPrototypeOf(cat1));　　//true

　　　　console.log(Cat.prototype.isPrototypeOf(cat2));　　//true

　　　　判断实例是否还有某个属性，不管是不是本地属性（in）

　　　　console.log('name' in cat1);　　//true

　　　　console.log('type' in cat1);　　//true