JS对象分类

做一个小程序

1个正方形

let square = {
   width: 5,
   getArea(){
   return this.width * this.width
    },
   getLength(){
   return this.width*4
    }
   }
   分析：
   有三个属性：边长、面积、周长

12个正方形，用for循环

边长都是为5的正方形
let squareList = []     /*一空数组*/
for (let i = 0; i < 12;i++){
    squareList[i] = { /*i的值从0到11。*/
    width: 5,
    getArea(){
     return this.width * this.width
    },
   getLength(){
   return this.width*4
     }
    }
   }

12个正方形，边长为不同的，用for循环

边长都是为5，6的正方形
let squareList = []     /*一空数组*/
**let widthList = [5,6,5,6,5,6,5,6,5,6,5,6]**
for (let i = 0; i < 12;i++){
    squareList[i] = { /*i的值从0到11。*/
    width: ** widthList = [i],**
    getArea(){
     return this.width * this.width
    },
   getLength(){
   return this.width*4
     }
    }
   }
此代码比较垃圾，浪费了大量内存。

内存图

let squareList = []
let widthList = [5,6,5,6,5,6,5,6,5,6,5,6]

function createSquare(width){
  let obj = Object.create(createSquare.squarePrototype) // 先使用后定义？NO
  obj.width = width
  return obj
}
createSquare.squarePrototype = { //把原型放到函数上，结合够紧密了吗？
  getArea(){ 
    return this.width * this.width 
  },
  getLength(){
    return this.width * 4
  },
  constructor: createSquare //方便通过原型找到构造函数
}
for(let i = 0; i<12; i++){
  squareList[i] = createSquare(widthList[i])
  console.log(squareList[i].constructor) 
  // constructor 可以知道谁构造了这个对象：你妈是谁？
}

函数与原型相结合

let squareList = []
let widthList = [5,6,5,6,5,6,5,6,5,6,5,6]

function createSquare(width){
  let obj = Object.create(createSquare.squarePrototype) // 先使用后定义？NO
  obj.width = width
  return obj
}
createSquare.squarePrototype = { //把原型放到函数上，结合够紧密了吗？
  getArea(){ 
    return this.width * this.width 
  },
  getLength(){
    return this.width * 4
  },
  constructor: createSquare //方便通过原型找到构造函数
}
for(let i = 0; i<12; i++){
  squareList[i] = createSquare(widthList[i])
  console.log(squareList[i].constructor) 
  // constructor 可以知道谁构造了这个对象：你妈是谁？
}

总结

1. new X() 自动做了四件事情
2. 自动创建空对象
3. 自动为空对象关联原型，原型地址指定为 X.prototype
4. 自动将空对象作为 this 关键字运行构造函数
5. 自动 return this
6. ——这就是 JS 之父的爱
7. 构造函数 X
8. X 函数本身负责给对象本身添加属性
9. X.prototype 对象负责保存对象的共用属性
10. 共有属性的集合就是原型

如何确定一个对象的原型

1. let obj = new Object() 的原型是 Object.prototype
2. let arr = new Array() 的原型是 Array.prototype
3. let square = new Square() 的原型是 Square.prototype
4. let fn = new Function() 的原型是 Function.prototype

你是谁构造的你的原型就是谁的 prototype 属性对应的对象， 对象.proto === 其构造函数.prototype

写一个圆圈

function Person(name,age){ this.name = name; this.age = age;

} Person.prototype.sayHi = function () { console.log('你好，我叫'+this.name)} let person = new Person('frank', 18) person.name === 'frank' // true person.age === 18 // true person.sayHi() // 打印出「你好，我叫 frank」

let person2 = new Person('jack', 19) person2.name === 'jack' // true person2.age === 19 // true person2.sayHi() // 打印出「你好，我叫 jack」

class Person { constructor(name, age) { this.name = name; this.age = age; }

sayHi() {

console.log('你好，我叫' + this.name)

} }

let person = new Person('frank', 18) person.name === 'frank' // true person.age === 18 // true person.sayHi() // 打印出「你好，我叫 frank」

let person2 = new Person('jack', 19) person2.name === 'jack' // true person2.age === 19 // true person2.sayHi() // 打印出「你好，我叫 jack」