《javascript高级程序设计》学习笔记 | 6.2.创建对象

最新推荐文章于 2024-03-05 17:36:10 发布

前端小讴

最新推荐文章于 2024-03-05 17:36:10 发布

阅读量140

点赞数 1

分类专栏：《javascript高级程序设计》学习笔记文章标签： javascript 前端面向对象编程

本文链接：https://blog.csdn.net/Simon9124/article/details/112188564

版权

《javascript高级程序设计》学习笔记专栏收录该内容

28 篇文章 2 订阅

订阅专栏

关注[前端小讴]，阅读更多原创技术文章

创建对象

创建单个对象：Object 构造函数和对象字面量
缺点：使用一个接口创建很多对象，产生大量重复代码

工厂模式

抽象了创建具体对象的过程
用函数来封装以特定接口创建对象的细节

function createPerson(name, age, job) {
  var o = new Object()
  o.name = name
  o.age = age
  o.job = job
  o.sayName = function () {
    console.log(this.name)
  }
  return o
}
var person1 = createPerson('Nicholas', 29, 'Engineer')
var person2 = createPerson('Greg', 27, 'Doctor')
console.log(person1)
console.log(person2)

工厂模式解决了创建多个相似对象的问题，但没有解决对象识别问题——即怎样知道一个对象的类型

构造函数模式

除了 Object 和 Array 等原生构造函数，还可以创建自定义的构造函数

function Person(name, age, job) {
  this.name = name
  this.age = age
  this.job = job
  this.sayName = function () {
    console.log(this.name)
  }
}
var person1 = Person('Nicholas', 29, 'Software Engineer')
var person2 = Person('Greg', 27, 'Doctor')

构造函数模式 vs 工厂模式：① 不显式的创建对象；② 直接将属性和方法赋给 this 对象；③ 没有 return
构造函数 new 一个对象后：① 创建了一个新对象；② 将构造函数的作用域（即 this）赋给新对象；③ 执行构造函数中的代码（即：为这个对象添加新属性）；④ 返回新对象
构造函数用大写字母开头，创建实例时用 new 操作符
创建的对象的 constructor 属性指向构造函数
创建的对象既是 Object 的实例，又是构造函数的实例

console.log(person1.constructor === Person) // true，constructor 属性指向构造函数
console.log(person2.constructor === Person) // true，constructor 属性指向构造函数
console.log(person1 instanceof Object) // true，是 Object 的实例
console.log(person1 instanceof Person) // true，也是 Person 的实例
console.log(person2 instanceof Object) // true，是 Object 的实例
console.log(person2 instanceof Person) // true，也是 Person 的实例

可以将自定义构造函数的实例标识为一种特定的类型，这是构造函数模式胜过工厂模式的地方
以该方法定义的构造函数是定义在 Global 对象中的，在浏览器中则是 window 对象

// 构造函数vs普通函数
var person3 = new Person('Nicholas', 29, 'Software Engineer') // 用构造函数创建对象
person3.sayName() // 'Nicholas'
Person('Greg', 27, 'Doctor') // 不使用new操作符，直接调用
global.sayName() // 直接调用函数时，this指向Global对象（浏览器中指向window对象）
var o = new Object() // 新对象o
var p = new Object() // 新对象p
Person.call(o, 'Kristen', 25, 'Nurse') // 扩充作用域，在对象o中调用Person()函数，call()分别传入每个参数
Person.apply(p, ['Kristen', 25, 'Nurse']) // 扩充作用域，在对象p中调用Person()函数，apply()传入参数数组
o.sayName() // 'Kristen'
p.sayName() // 'Kristen'

构造函数的问题在于，对象的每个方法都要在每个实例上重新创建一遍，既“每定义一个函数，就实例化一个对象”
而创建 2 个完成同样任务的 Function 实例没有必要

function Person2(name, age, job) {
  this.name = name
  this.age = age
  this.job = job
  this.sayName = new Function(console.log(this.name)) // 与声明函数逻辑等价，每创建一个对象就要创建一个Function实例
}
console.log(person1.sayName === person2.sayName) // false，新对象的2个方法的作用域链和标识符解析不同

将对象的方法移到构造函数外部，避免多次创建 Function 实例

function Person3(name, age, job) {
  this.name = name
  this.age = age
  this.job = job
  this.sayName = sayName
}
function sayName() {
  console.log(this.name) // 将sayName设置成全局函数
}
var person4 = new Person('Nicholas', 29, 'Software Engineer')

构造函数仍未解决的问题：① 创建的全局函数实际上只需要被某个对象中调用；② 若对象有多个方法，则需创建很多全局对象

原型模式

每个函数都有 prototype 原型属性，该属性是一个指针，指向函数的原型对象，并包含特定类型的所有实例共享的属性和方法，即“通过调用构造函数-而创建的那个对象实例的-原型对象”
使用原型对象的好处是，其所有对象实例共享其所包含的属性和方法

理解原型对象

function PersonPrototype() {}
PersonPrototype.prototype.name = 'Nicholas' // 为PersonPrototype的原型对象添加属性
PersonPrototype.prototype.age = 29 // 为PersonPrototype的原型对象添加属性
PersonPrototype.prototype.job = 'Software Engineer' // 为PersonPrototype的原型对象添加属性
PersonPrototype.prototype.sayName = function () {
  // 为PersonPrototype的原型对象添加方法
  console.log(this.name)
}
var person5 = new PersonPrototype()
var person6 = new PersonPrototype()
person5.sayName() // 'Nicholas'
person6.sayName() // 'Nicholas'
console.log(person5.sayName === person6.sayName) // true，prototype上创建的属性和方法，由新对象的所有实例共享

原型对象自动获得 constructor（构造函数）属性，指向 prototype 属性所在函数的指针，即构造函数

console.log(PersonPrototype.prototype.constructor) // Function: PersonPrototype构造函数
console.log(PersonPrototype === PersonPrototype.prototype.constructor) // true，都指向构造函数

实例内部包含[[Prototype]]指针，指向实例的构造函数的原型对象，但没有标准的方式访问[[Prototype]]
在浏览器中，可用 __proto__ 属性实现[[Prototype]]的功能

console.log(person5.__proto__) // 原型对象，PersonPrototype {name: 'Nicholas',age: 29,job: 'Software Engineer',sayName: [Function] }
console.log(person5.__proto__ === PersonPrototype.prototype) // true，都指向原型对象
console.log(person5.__proto__.constructor) // Function: PersonPrototype构造函数

原型对象的 isPrototypeOf()方法，检测实例中否有指向原型对象的指针

console.log(PersonPrototype.prototype.isPrototypeOf(person5)) // true，person5包含指向PersonPrototype的原型对象的指针
console.log(PersonPrototype.prototype.isPrototypeOf(person1)) // false，person1不包含指向PersonPrototype的原型对象的指针

ES5 追加 Object.getPrototypeOf()方法，参数为实例，返回实例的构造函数的原型对象

console.log(Object.getPrototypeOf(person5)) // 原型对象
console.log(Object.getPrototypeOf(person5) === person5.__proto__) // true，都指向原型对象
console.log(Object.getPrototypeOf(person5) === PersonPrototype.prototype) // true，都指向原型对象
console.log(Object.getPrototypeOf(person5).name) // 'Nicholas'
console.log(Object.getPrototypeOf(person5).constructor) // Function: PersonPrototype构造函数

代码读取对象属性的搜索过程：
- 1.搜索对象实例本身 -> 有属性 → 返回属性值 -> 结束
- 2.对象实例本身无属性 -> 搜索原型对象 → 有/无属性 → 返回属性值/undefined → 结束
可以通过实例访问原型中属性的值，但无法通过实例重写原型中属性的值
如果添加的实例属性与原型的属性同名，则实例属性屏蔽原型中的属性
删除同名的实例属性，可恢复被屏蔽的原型的属性

var person7 = new PersonPrototype()
person7.name = 'Greg'
console.log(person7.name) // 'Greg'，来自实例
console.log(person5.name) // 'Nicholas'，来自原型
delete person7.name
console.log(person7.name) // 'Nicholas'，来自原型

使用 hasOwnProperty(‘属性’) 检测属性存在于实例 or 原型，存在于实例返回 true

var person8 = new PersonPrototype()
var person9 = new PersonPrototype()
console.log(person8.hasOwnProperty('name')) // false，name不存在在person8的实例中
person8.name = 'Simon'
console.log(person8.name) // 'Simon'，来自实例
console.log(person8.hasOwnProperty('name')) // true，name存在在person8的实例中
console.log(person9.name) // 'Nicholas'，来自原型
console.log(person9.hasOwnProperty('name')) // false，name不存在在person8的实例中
delete person8.name
console.log(person8.name) // 'Nicholas'，来自原型
console.log(person8.hasOwnProperty('name')) // false，person8实例的name属性已被删除

可在原型对象上调用 Object.getOwnPropertyDescriptor()，获取原型属性的描述符

console.log(Object.getOwnPropertyDescriptor(person8, 'name')) // undefined，person8实例上没有name属性
console.log(Object.getOwnPropertyDescriptor(person8.__proto__, 'name')) // {value: 'Nicholas',writable: true,enumerable: true,configurable: true}，原型对象的name属性描述符

原型与 in 操作符

单独使用 in：对象能够访问指定属性则返回 true，无论属性在实例中还是原型中

function PersonIn() {}
PersonIn.prototype.name = 'Nicholas'
PersonIn.prototype.age = 29
PersonIn.prototype.job = 'Software Engineer'
PersonIn.prototype.sayName = function () {
  console.log(this.name)
}
var person9 = new PersonIn()
var person10 = new PersonIn()
console.log(person9.hasOwnProperty('name')) // false，实例person9中不含name属性
console.log('name' in person9) // true，通过person9可以访问到name属性
person9.name = 'Greg'
console.log(person9.name); // 'Greg'，来自实例
console.log(person9.hasOwnProperty('name')) // true，实例person9中包含name属性
console.log('name' in person9) // true，通过person9可以访问到name属性
console.log(person10.name); // 'Nicholas'，来自原型
console.log(person10.hasOwnProperty('name')) // false，实例person10中不含name属性
console.log('name' in person10) // true，通过person10可以访问到name属性
delete person9 'name'
console.log(person9.name); // 'Nicholas'，来自原型
console.log(person9.hasOwnProperty('name')) // false，实例person9中不含name属性
console.log('name' in person9) // true，通过person9可以访问到name属性

同时使用 hasOwnProperty 和 in，判断属性存在于对象 or 原型

function hasPrototypeProperty(object, name) {
  return !object.hasOwnProperty(name) && name in object
}
var person11 = new PersonIn()
console.log(hasPrototypeProperty(person11, 'name')) // true，!false && true
person11.name = 'Greg'
console.log(hasPrototypeProperty(person11, 'name')) // false，!true && true

for-in 循环使用 in：返回所有能够通过对象访问的、可枚举的属性（无论来自实例还是原型），屏蔽了原型中不可枚举的属性（[[Enumerable]]为 false 的属性，如 constructor 和 prototype）

for (var attr in person11) {
  console.log(`${attr}:${person11[attr]}`)
  /*  
    name:Greg
    age:29
    job:Software Engineer
    sayName:function () {
      console.log(this.name)
    } 
  */
}

Object.keys()：接收一个对象作为参数，返回该对象上（仅该对象自身）可枚举的属性的数组

var keys = Object.keys(PersonIn.prototype) // 原型对象的所有可枚举属性
console.log(keys) // [ 'name', 'age', 'job', 'sayName' ]
var person12 = new PersonIn()
person12.name = 'Bob'
person12.age = 31
var p12keys = Object.keys(person12) // person12的所有可枚举属性
console.log(p12keys) // [ 'name', 'age' ]

Object.getOwnPropertyNames()：获取该对象上（仅该对象自身）所有属性的数组，无论是否可枚举

var keys = Object.getOwnPropertyNames(PersonIn.prototype) // 原型对象的所有属性，包含不可枚举
console.log(keys) // [ 'constructor', 'name', 'age', 'job', 'sayName' ]，原型对象都包含constructor属性，指向构造函数
var p12keys = Object.getOwnPropertyNames(person12) // person12的所有属性，包含不可枚举
console.log(p12keys) // [ 'name', 'age' ]

更简单的原型语法

用包含所有属性和方法的新对象字面量来重写整个原型对象

function PersonLiteral() {}
PersonLiteral.prototype = {
  name: 'Nicholas',
  age: 29,
  job: 'Software Engineer',
  sayName: function () {
    console.log(this.name)
  },
}

将构造函数的 prototype 属性设置为一个以对象字面量形式创建新对象，其 constructor 属性不再指向原构造函数，而是
新对象的 constructor 属性，即 Object 构造函数

var friend = new PersonLiteral()
console.log(friend instanceof Object) // true，friend是Object的实例
console.log(friend instanceof PersonLiteral) // true，friend是PersonLiteral的实例
console.log(friend.constructor === PersonLiteral) // false，constructor属性变成了新对象——即对象字面量的constructor
console.log(friend.constructor === Object) // true，新对象的constructor指向Object

可以在对象字面量里设置 constructor 属性，让其指向原构造函数
这样设置 constructor 属性属于“直接在对象上定义的属性”，会导致 PersonLiteral2.prototype 的 constructor 属性的[[Enumerable]]为 true，可以被循环返回

function PersonLiteral2() {}
PersonLiteral2.prototype = {
  constructor: PersonLiteral2, // 直接在对象上定义constructor，指向原构造函数
  name: 'Nicholas',
  age: 29,
  job: 'Software Engineer',
  sayName: function () {
    console.log(this.name)
  },
}
var friend2 = new PersonLiteral2()
console.log(friend2.constructor === PersonLiteral2) // true，constructor再次指向原构造函数
console.log(friend2.constructor === Object) // false
var keys = Object.keys(PersonLiteral2.prototype)
console.log(keys) // [ 'constructor', 'name', 'age', 'job', 'sayName' ]，因为constructor是“直接在对象上定义的属性”

用 Object.defineProperty()修改对象字面量中 constructor 属性的特性，以兼容 ES5 的 javascript 引擎

Object.defineProperty(PersonLiteral2.prototype, 'constructor', {
  enumerable: false,
  value: PersonLiteral2,
})
var keys = Object.keys(PersonLiteral2.prototype)
console.log(keys) // [ 'name', 'age', 'job', 'sayName' ]，constructor的enumerable已被设置为false

原型的动态性

对原型对象所做的任何修改都立即从实例上反映出来，即使先创建实例后修改原型

function Person4() {}
var friend3 = new Person4()
Person4.prototype.sayHi = function () {
  console.log('Hi')
}
friend3.sayHi() // 'Hi'，先在friend3实例中搜索sayHi属性，没有找到则继续找原型对象

重写整个原型对象，会切断构造函数与最初原型之间的联系，而实例的[[Prototype]]指针指向最初的原型对象

Person4.prototype = {
  constructor: Person4,
  name: 'Nicholas',
  age: 29,
  job: 'Software Engineer',
  sayName: function () {
    console.log(this.name)
  },
}
console.log(friend3.__proto__) // Person4 { sayHi: [Function] }，最初的原型对象
console.log(friend3.__proto__ === Person4.prototype) // false，实例的__proto__指向最初的原型对象，重写整个原型切断了构造函数与最初原型之间的联系
friend3.sayName() // error:friend3.sayName is not a function

原生对象的原型

所有原生的引用类型（Array、Object、String…），都是用原型模式创建的，在其构造函数的原型上定义了方法

console.log(Array.prototype) // 在浏览器中查看Array的原型对象，包含sort()等方法
console.log(String.prototype) // 在浏览器中查看Array的原型对象，包含substring()等方法

可以像修改自定义对象的原型一样，修改原生对象的原型，添加或删除方法
不推荐修改原生对象的原型，可能会引起冲突或重写原生方法

String.prototype.startsWith = function (text) {
  // 给String的原型对象添加startsWith方法
  return this.indexOf(text) === 0
}
var msg = 'Hello World'
console.log(msg.startsWith('Hello')) // true
console.log(msg.startsWith('World')) // false
delete String.prototype.startsWith
console.log(msg.startsWith('Hello')) // error

原型对象的问题

原型模式最大的问题是由其共享的本性导致的，尤其对于包含引用类型的属性，对实例的数组、对象等引用类型的属性进行增删改而非重新定义时，会对原型的引用类型属性造成影响

function PersonProblem() {}
PersonProblem.prototype = {
  constructor: PersonProblem,
  name: 'Nicholas',
  age: 29,
  job: 'Software Engineer',
  friends: ['Shelby', 'Court'],
  sayName: function () {
    console.log(this.name)
  },
}
var person13 = new PersonProblem()
var person14 = new PersonProblem()
person13.name = 'Greg' // 重新定义，在实例中屏蔽原型的属性
person13.friends.push('Van') // 非重新定义，而是向原型的数组中添加一个字符串
console.log(person13.name) // 'Greg'，从实例获得
console.log(person14.name) // 'Nicholas'，从原型中获得
console.log(person13.friends) // [ 'Shelby', 'Court', 'Van' ]，从原型中获得
console.log(person14.friends) // [ 'Shelby', 'Court', 'Van' ]，从原型中获得
console.log(person13.friends === person14.friends) // true
var person15 = new PersonProblem()
person15.friends = [] // 重新定义，在实例中屏蔽原型的属性
console.log(person15.friends) // []，从实例获得
console.log(person13.friends) // [ 'Shelby', 'Court', 'Van' ]，从原型中获得
console.log(person14.friends) // [ 'Shelby', 'Court', 'Van' ]，从原型中获得

组合使用构造函数模式和原型模式

构造函数模式用于定义实例属性，原型模式用域定义方法和共享的属性
每个实例都有自己的一份实例属性的副本，同时共享着对方法的引用，最大限度节省内存
该模式是目前 ECMAScript 中使用最广泛、认同度最高的创建自定义类型的方法

function PersonMix(name, age, job) {
  // 在构造函数定义实例属性
  this.name = name
  this.age = age
  this.job = job
  this.friends = ['Shelby', 'Court']
}
PersonMix.prototype = {
  // 在原型定义方法和共享的属性
  constructor: PersonMix, // 直接在对象上定义constructor属性，指向构造函数，[[Enumerable]]为true
  sayName: function () {
    console.log(this.name)
  },
}
var person16 = new PersonMix('Nicholas', 29, 'Software Engineer')
var person17 = new PersonMix('Greg', 27, 'Doctor')
person16.friends.push('Van') // 仅向person16实例本身的friends数组push数据
console.log(person16.friends) // [ 'Shelby', 'Court', 'Van' ]
console.log(person17.friends) // [ 'Shelby', 'Court' ]
console.log(person16.friends === person17.friends) // false，person16实例的friends数组push了数据
console.log(person16.sayName === person17.sayName) // true，共享方法sayName

动态原型模式

将所有信息（属性、方法）都封装在构造函数中，通过检查某个方法是否有效，来决定是否需要初始化原型

function PersonDynamic(name, age, job) {
  // 属性
  this.name = name
  this.age = age
  this.job = job
  // 方法：①只有方法不存在时才添加到原型；②只在初次调用构造函数时执行；③会立即在实例中体现
  if (typeof this.sayName !== 'function') {
    PersonDynamic.prototype.sayName = function () {
      console.log(this.name)
    }
  }
}
var person18 = new PersonDynamic('Nicholas', 29, 'Software Engineer')
person18.sayName() // 'Nicholas'
console.log(person18 instanceof PersonDynamic) // true，person18是PersonDynamic的实例

只有在方法不存在时，才会将方法添加到原型
只在初次调用构造函数时才会执行，此后原型已经完成初始化
对原型所做的修改，会立即在实例中体现
与原型的动态性同理，如果已经创建了实例后再用对象字面量重写原型，会切断实例与新原型之间的联系，导致修改无效

PersonDynamic.prototype = {
  newName:
    typeof this.newName !== 'function'
      ? function () {
          console.log('prototype:', this.name)
        }
      : this.newName,
}
person18.newName() // error，person18指向最初的原型，没有newName方法
var person19 = new PersonDynamic('Greg', 27, 'Doctor') // person19是重写原型后创建的实例
person19.newName() // prototype: Greg
person19.sayName() // Greg

console.log(person18 instanceof PersonDynamic) // false，person18不是重写原型后的PersonDynamic的实例，person18指向最初的原型
console.log(person19 instanceof PersonDynamic) // true，person19是重写原型后的PersonDynamic的实例

寄生构造函数模式

构造函数仅封装创建对象的代码，在构造函数内部用原生引用类型创建新对象，经过操作后再返回这个新对象
构造函数内部跟工厂模式一模一样，调用时用 new 操作符，类似于工厂模式与构造函数模式的结合体

function PersonParasitic(name, age, job) {
  var o = new Object() // 用原生引用类型创建对象
  o.name = name // 添加值
  o.age = age // 添加值
  o.job = job // 添加值
  // 添加方法
  o.sayName = function () {
    console.log(this.name)
  }
  return o
}
var person20 = new PersonParasitic('Nicholas', 29, 'Software Engineer')
person20.sayName() // 'Nicholas'

寄生构造函数模式创建的实例，与构造函数或构造函数的原型没有关联，不能依赖 instanceof 确定对象类型
如果可以用其他模式，不建议该模式创建自定义对象

function SpecialArray() {
  var values = new Array() // 用原生引用类型创建数组
  values.push.apply(values, arguments) // 添加值
  // 添加方法
  values.toPipedString = function () {
    return this.join('|')
  }
  return values // 返回经过操作后的数组
}
var colors = new SpecialArray('red', 'blue', 'green')
console.log(colors.toPipedString()) // red|blue|green
console.log(SpecialArray.prototype) // SpecialArray{}，构造函数的原型对象
console.log(colors.__proto__) // []，构造函数内部通过new Array()重新初始化，其原型对象是原生对象Array
console.log(SpecialArray.prototype === colors.__proto__) // false，二者无关联
console.log(colors instanceof SpecialArray) // false，二者无关联

稳妥构造函数模式

与计生构造函数类似类似，在构造函数中用原生引用类型创建新对象，但没有公共属性、其方法也不引用 this、不使用 new 调用构造函数
除了构造函数内部的方法，没有其他办法可访问到构造函数内部的原始数据（即便有其他代码给对象添加方法或属性），该模式适合在安全环境下使用
同寄生构造函数模式，该模式下创建的实例，与构造函数或构造函数的原型没有关联，不能依赖 instanceof 确定对象类型

function PersonSafe(name, age, job) {
  var o = new Object() // 用原生引用类型创建对象
  o.sayName = function () {
    console.log(name)
  }
  return o
}
var person21 = new PersonParasitic('Nicholas', 29, 'Software Engineer')
person21.sayName() // 'Nicholas'

总结 & 问点

创建对象	过程	缺点
Object 构造函数	1.创建 Objecty 实例 2.添加属性和方法	同一接口创建多个对象，大量重复代码
对象字面量	直接创建包含属性和方法的对象	同一接口创建多个对象，大量重复代码
工厂模式	1.用函数封装创建 Object 实例的过程（添加属性和方法、返回该实例对象） 2.调用该函数	没有解决对象识别问题，即怎样知道一个对象的类型
构造函数模式	1.构造函数封装（不显示的创建对象、属性和方法赋给 this 对象、无 return） 2.new 调用构造函数	每个实例重新创建方法，机制相同的 Function 对象被多次实例化
原型模式	1.构造函数封装（空的，无属性和方法） 2.原型对象上添加属性和方法 3.new 调用构造函数	对实例的引用类型属性修改而非重新定义时，会对原型的引用类型属性造成影响
组合使用构造函数模式和原型模式	1.构造函数封装实例属性 2.原型模式定义方法和共享属性 3.new 调用构造函数	无明显缺点，目前最广泛认同度最高，是默认模式
动态原型模式	1.构造函数封装所有信息（属性、检查某个方法是否有效来决定是否初始化原型） 2.new 调用构造函数	无明显缺点，不要使用对象字面量重写原型
寄生构造函数模式	1.构造函数封装（原生引用类型创建新对象、添加值或方法、返回新对象） 2.new 调用构造函数	实例与构造函数或构造函数的原型没有关联，不能依赖 instanceof 确定对象类型
稳妥构造函数模式	1.同寄生构造函数模式的构造函数封装（但方法不引用 this） 2.作为普通函数调用构造函数	实例与构造函数或构造函数的原型没有关联，不能依赖 instanceof 确定对象类型

对象	属性	指向	用法
任何函数	prototype	原型对象	`Person.prototype` → 构造函数的原型对象
实例、原型	constructor	构造函数	`person1.constructor === Person.prototype.constructor === Person`
实例	`[[Prototype]]`	原型对象	`person1.__proto__ === Person.prototype`（没有标准方式访问`[[Prototype]]`，但可用 `__proto__`）

操作符	含义	用法
new	创建构造函数的实例（四个步骤）	`var person = new Person()`
in	能否通过对象访问到属性（无论属性在实例还是原型中）	`console.log('name' in person)`
for-in	返回所有能通过对象访问到的、可枚举的属性（无论属性在实例还是原型中）	`for(var attr in person){console.log(attr)}`
delete	删除实例属性	`delete person.name`

对象	方法	含义	参数	返回值	用法
Object 对象	getPrototypeOf()	获取实例对象的原型	实例	原型对象	`Object.getPrototypeOf('person') === Person.prototype`
任何对象	hasOwnProperty()	对象自身（不包括原型）是否含有该属性	属性	true/false	`console.log(Person.hasOwnProperty('name'))`
Object 对象	keys()	获取对象上所有可枚举的属性（仅对象自身）	对象	属性的字符串数组	`Object.keys(person)`
Object 对象	getOwnPropertyNames()	获取对象上所有属性（仅对象自身，无论是否可枚举）	对象	属性的字符串数组	`Object.getOwnPropertyNames(person)`，原型对象会包含 constructor 属性

创建单个对象有哪些方法？这些方法有什
么缺点？
工厂模式做出了怎样的优化？该模式有什么缺点？
相比工厂模式，构造函数模式有哪些区别？如何创建其实例？
构造函数在 new 的过程中都发生了什么？
构造函数创建出的对象，其 construtor 属性指向哪里？这样的对象是哪些构造函数的实例？
相比工厂模式，构造函数有什么优势？
构造函数与普通函数有什么相同点和区别？
自定义对象的方法时，构造函数模式有什么缺点？
用全局函数代替构造函数内部的对象属性的方法，仍有什么缺点？
prototype 属性的含义和用法？使用原型对象的好处是什么？
原型对象的 constructor 属性的含义和用法？
用什么方法检测实例是否含有指向原型对象的指针？
构造函数、实例的哪些属性或方法可获得原型对象？如何通过实例获得构造函数？
代码读取对象属性时，经历了怎样的搜索过程？
是否可以通过实例访问和修改原型中的属性值？
在实例中添加与原型的同名属性会怎样？再删除这个实例中的属性呢？
用什么方法检测属性存在与实例 or 原型？
用什么方法获取原型属性的描述符？
单独使用 in 的用法是什么？其和 hasOwnProperty()方法的区别是什么？
for-in 的用法是什么？其返回哪些属性屏蔽哪些属性？
Object.keys()的和 Object.getOwnPropertyNames()用法分别是什么？
Object.getOwnPropertyNames()、Object.leys()、for-in 的区别是什么？
用一个对象字面量的新对象重写整个原型对象时，原型对象的 constructor 指向发生了怎样的改变？
写一段代码，用对象字面量重写构造函数的原型对象，且让原型对象的 constructor 仍指向原构造函数，并保留 construtor 的[[Enumerable]]特性为 false
创建实例后再修改原型的属性，实例会受到影响么？为什么？
重写整个原型对象后，构造函数的 prototype 指向哪里？实例的[[Prototype]]属性指向哪里？为什么？
原生引用类型的方法是如何创建的？为什么不推荐修改原生引用类型的原型？
原型模式的“共享”本性，在修改包含引用类型的属性时，有怎样的问题？
ECMAScript 使用最广泛、认同度最高的创建自定义类型的方法是什么？其原理和优势是什么？
动态原型模式是如何初始化原型的？其对原型的修改有哪些注意点？
寄生构造函数模式的原理是什么？为什么其创建的实例，与其构造函数或构造函数的原型没有关联？
稳妥构造函数模式的原理是什么？为什么该模式比较“稳妥”？

前端小讴

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
《javascript高级程序设计》学习笔记 | 6.2.创建对象

欢迎关注[前端小讴的github]，阅读更多原创技术文章创建对象创建单个对象：Object 构造函数和对象字面量缺点：使用一个接口创建很多对象，产生大量重复代码相关代码 →工厂模式抽象了创建具体对象的过程用函数来封装以特定接口创建对象的细节function createPerson(name, age, job) { var o = new Object() o.name = name o.age = age o.job = job o.sayName =.
复制链接

扫一扫

专栏目录