4-13 JS对象分类（原型和共有属性、对象分类、函数对象、数组分类、class语法）

原型和共有属性

1.关系

• JS的对象只能存简单数据类型和地址，不能存对象

2.如何确定一个对象的原型
函数fn由谁构造，fn的原型就是谁的prototype属性对应的对象

• let obj = new Object() 的原型是 Object.prototype
• let arr = new Array() 的原型是 Array.prototype
• let square = new Square() 的原型是 Square.prototype
• let fn = new Function() 的原型是 Function.prototype

原因是：new操作故意这么做的

3.原型公式
对象.__proto__ === 其构造函数.prototype
两个的值相同，都是同一个地址

4.案例

例1：

• let x = {}的原型
  由于对象的原型是其构造函数的prototype对应的对象
  而x是一个对象，因此的构造函数是Object
  
  内存图：
  注意区分属性名和属性值的区别，Object是名，#203这个地址对应对象才是window.Object的值
  

例2：

• Object.prototype 是哪个函数构造出来的？
• 答：没有构造函数和原型
• 特殊点：Object.prototype 是唯一一个__proto__为null的对象
  

对象需要分类

1.对象需要分类的原因

1.1 理由一

• 很多对象拥有一样的属性和行为
• 需要把它们分为同一类
• 如square1和square2
• 这样创建对象的时候就很方便

1.2 理由二

• 还有很多对象拥有其他的属性和行为
• 需要不同的分类
• 如Square/Circle/Rect就是不同的分类
• Array（数组）和Function（函数）也是不同的分类
• 而Object创建出来的对象，是最没有特点的对象

2.类型V.S.类

• 类型
  类型是JS数据的分类，有7种
  四基两空一对象
• 类
  针对于对象的分类，有无数种（构造函数）
  常见的有：Array、Function、Date、RegExp

3.数组对象

数组是一个对象

• 定义一个数组
  let arr = [1,2,3]（缩写）
  let arr = new Array(1,2,3)：元素为1，2，3
  let arr = new Array(3)：数组长度为3，但没有函数名和函数值，是empty
• 数组对象的自身属性
  '0' / '1' / '2' / 'length'
  注意：属性名没有数字，只有字符串
• 数组对象的共用属性
  push/pop/shift/unshift/jion
  具体用法都在MDN
• 数组对象比普通对象多一层共有属性

4.函数对象

• 定义一个函数
  function fn(x,y){return x+y}
let fn2 = function fn(x,y){return x+y}赋值语句
  let fn = (x,y) => x+y箭头函数
  let fn = new Function('x','y', 'return x+y')其中的'return x+y'是函数体
• 函数对象自身属性
  'name'（一般不用管）/'length'（接收参数的个数，2就是接收两个参数x和y）
• 函数对象共用属性
  'call'/'apply'/'bind'

JS终极一问

• window是谁构造的?
  Window（注意首字母大写）
  可以通过window.constructor属性看出构造者
• window.Object是谁构造的?
  window.Function
  所有的函数对象都是由window.Function构造出来的
• window.Function 是谁构造的?
  window.Function
  所有的函数对象都是由window.Function构造出来的（并非是自己构造了自己）
  浏览器构造了 Function，然后指定它的构造者是自己
  

class语法

ES6引入了新语法：class语法

• class引用了更多的概念
• 就是构造函数的另一种写法
  引入了新的概念

class Square{
  //引入其他概念，可以不写
  static x = 1//x是Square，要用x写：Square.x
  width = 0//给初始化this，没有也可以
  //构造函数
  constructor(width){
    this.width = width
  } 
  //共同属性
  getArea(){ 
    return this.width * this.width 
  }
  getLength(){
    return this.width * 4
  }
   // 只读属性,调用area2的时候不需要加括号，直接 square.area2
  get area2(){
    return this.width * this.width
  }
}