测试17

[ZhaoHui0502]

原型

在js中，函数是一个包含属性和方法的Function类型的对象，而原型就是Function类型对象的一个属性

在函数定义是就包含了prototype属性，它的初始值是一个空对象，在js中并没有定义函数的原型类型，所以原型可以是任何类型

原型是用于保存对象的共享属性和方法的，原型的属性和方法并不会影响函数本身的属性和方法

console.log(Function.prototype)
//Function类型的属性就是所有函数的属性

function fn() {
    console.log("我是函数")
}

console.log(fn.prototype) //原型的默认值是一个空对象

//函数包含构造函数->所有引用类型其实都是构造函数
console.log(Number.prototype)

console.log(Object.prototype)

获取原型及新增属性

通过两种方式可以获取对象的原型，从而设置共享的属性和方法：

• 通过构造函数的prototype属性
• 通过Object对象的getPrototypeof(obj)方法

function Person() {
    console.log("我是Person")
}

console.log(Person.prototype)
console.log(Person["prototype"])

function people() {
    console.log("我是people")
}

console.log(Object.getPrototypeOf(people))

通过两种方式可以设置原型的属性和方法：

• 原型的属性和方法单独定义

  构造函数.prototype.属性名 = 属性值
  构造函数.prototype.方法名 = function(){}

• 直接为原型定义一个新对象

  构造函数.prototype = {
  属性名：属性值，
  方法名：function(){}
  }

  function Person() {
    console.log("我是Person")
  }
  
  console.log(Person.prototype)
  console.log(Person["prototype"])
  //通过构造函数的prototype属性获取原型
  
  function people() {
    console.log("我是people")
  }
  //通过Object对象的getPrototypeof(obj)方法获取原型
  console.log(Object.getPrototypeOf(people))
  
  function fn() {
    console.log("我是小明")
  }
  var proto = fn.prototype //此时变量proto是一个空对象
  
  proto.name = "小明"
  console.log(proto.name)
  console.log(fn.prototype)
  console.log(fn.prototype.name)
  
  Object.defineProperty(fn.prototype, "age", {
    value: 18,
    enumerable: true
  })
  console.log(fn.prototype)

构造函数的原型

function Hero() {
    this.name = "小明"
    this.sayMe = function () {
        console.log("我是小明")
    }
} //构造函数

//操作构造函数的原型
Hero.prototype.age = 18

var hero = new Hero() //实例化

console.log(hero)
console.log(hero.age) //？？？？
//在构造函数的原型中添加的属性，在实例化的对象中也可以访问，可以调用但是不能直接打印（不能枚举）

var result = Object.getOwnPropertyDescriptor(hero, "age") //为了证明hero中有age
console.log(result) //undefined
//结果证明hero中不存在age属性

//hero  -->  Hero  --> Hero有prototype  --> prototype指向一个空对象，空对象中有age
//实例化的过程中不光拿到构造函数的属性和方法，实例化的对象也有东西指向构造函数的prototype指向的空对象

自有属性与原型属性

• 自有属性：通过对象引用添加的属性。其他对象可能无此属性；既是有，也是彼此独立的属性
• 原型属性：从原型对象中继承来的属性，一旦原型对象中属性值改变，所有继承自该原型的对象属性均改变

function Hero(name) {
    this.name = name
    this.sayMe = function () {
        console.log("我是小明")
    }
}
//通过构造函数的prototype新增属性和方法
Hero.prototype.age = 18
//此时这个age添加在构造函数的prototype指向的空对象上
//通过原型所定义的属性叫做 原型属性

var hero = new Hero("小明")
//此时这个对象不仅具有构造函数的自有属性，还具有构造函数的原型属性
console.log(hero.name)
console.log(hero.age)

var hero2 = new Hero("小红")
console.log(hero2.name)
console.log(hero2.age)