当前位置:   article > 正文

JavaScript高级程序设计(第4版)学习随笔【第八章】_js 高级程序设计 读书笔记 第四版 第八章

js 高级程序设计 读书笔记 第四版 第八章


一、对象

对象是一组没有特定顺序值的集合。

1、创建对象

通常是new一个Object实例,然后给它添加属性和方法:
在这里插入图片描述
更流行的是用对象字面量方法,更为简洁,和前面创建的对象是等价的。
在这里插入图片描述

工厂模式创建对象

new一个object和对象字面量创建虽然方便,但创建具有同样接口的多个对象会发现有很多重复的代码很多,于是有了工厂模式。

我们拿创建多个学生来举个栗子。
在这里插入图片描述

构造函数模式

 没有显式地创建对象。
 属性和方法直接赋值给了 this。
 没有 return。
在这里插入图片描述
注:一般构造函数名首字母大写。
构造函数也是函数,任何函数只要使用了new操作符调用就是构造函数。

原型模式

每个函数都会创建一个prototype属性对象,包含实例共享的属性和方法,这个对象就是通过调用构造函数创建的对象的原型。默认情况下,所有原型对象自动获得一个constructor 的属性,指回与之关联的构造函数。

  • Object.getPrototypeOf(),返回参数的内部特性[[Prototype]]的值;
  • Object.setPrototypeOf,可以向实例的私有特性[[Prototype]]写入一个新值;
  • Object.hasOwnProperty,可以的得知访问的是实例属性还是原型属性;
  • Object.getOwnPropertyDescriptor(),只对实例属性有效;
  • Object.keys(),可获得对象上所有可枚举的实例属性。

2、属性的类型(数据属性和访问器属性)

数据属性包含一个保存数据值的位置,值会从这个位置读取和写入,有4个特性描述它们的行为。

  • [[Configurable]]:表示属性是否可以通过 delete 删除并重新定义,是否可以修改它的特
    性,以及是否可以把它改为访问器属性。默认true。
  • [[Enumerable]]:表示属性是否可以通过 for-in 循环返回。默认true。
  • [[Writable]]:表示属性是否可以被修改。默认true。
  • [[Value]]:包含属性实际的值,读取和写入属性值得位置。默认undefined。
修改默认的数据属性:Object.defineProperty()和Object.defineProperties()

想要修改这些默认的数据属性,需要用 Object.defineProperty()方法。方法接受三个参数(对象,属性名称和描述符对象),比如:
在这里插入图片描述
将name属性的Writable置为false之后可见修改name并没有修改成功。
在这里插入图片描述
将name属性的Configurable置为false之后可见删除name并没有删除成功。此处注意将一个属性configurable置为false是不可逆的,该属性设置为不可配置后不能再配置了。
在这里插入图片描述
访问器属性不包括数据值,包含一个获取(getter)函数和一个设置(setter)函数,不过这两个函数不是必需的,访问器属性有 4 个特性描述它们的行为。

  • [[Configurable]]:表示属性是否可以通过 delete 删除并重新定义,是否可以修改它的特
    性,以及是否可以把它改为访问器属性。默认true。
  • [[Enumerable]]::表示属性是否可以通过 for-in 循环返回。默认true。
  • [[[Get]]:获取函数,在读取属性时调用。默认值为 undefined。
  • [[[Set]]:设置函数,在写入属性时调用。默认值为 undefined。
    和数据属性一样,必须使用Object.defineProperty()修改。
    在这里插入图片描述
    year_中的下划线常用来表示该属性并不希望在对象方法的外部被访问。另一个属性 year 被定义为一个访问器属性,其中获取函数简单地返回 year_的值,而设置函数会做一些计算以决定正确的版本(a)。

定义多个属性时,可用Object.defineProperties()方法,可一次性定义多个属性:
在这里插入图片描述

读取属性的特性:Object.getOwnPropertyDescriptor()和Object.getOwnPropertyDescriptors()

读取某个属性的特性,使用 Object.getOwnPropertyDescriptor(对象,属性名称)方法:
读取所有属性的特性,使用 Object.getOwnPropertyDescriptors(对象)方法:
在这里插入图片描述

合并对象,使用Object.assign()方法:

在这里插入图片描述
Object.assign()实际上对每个源对象执行的是浅复制,如果不想改变原有的对象,需要第二种写法。

对象标识及相等判定:Object.is()

在这里插入图片描述

增强的对象语法

1、属性值简写
属性名和变量名一样的时候,可简写
在这里插入图片描述
2、可计算属性
有了可计算属性,就可以在对象字面量中完成动态属性赋值。
在这里插入图片描述
3、简写方法名
在这里插入图片描述
4、对象解构
不使用对象解构:
在这里插入图片描述
使用对象解构:
在这里插入图片描述
遇到不存在的属性,则为undefined,也可以同时定义默认值。
在这里插入图片描述
解构在内部使用函数ToObject()(不能在运行时环境中直接访问)把源数据结构转换成对象。所以null和undefined不能被解构。
在这里插入图片描述
也可以事先声明变量,后解构对象赋值,不过表达式必须用括号括起来:
在这里插入图片描述
嵌套解构:(可用于浅拷贝对象)
在这里插入图片描述
部分解构:
多属性一起解构,有一个出错,可能会只完成一部分的解构
在这里插入图片描述

3、继承

很多面向对象语言都支持两种继承:

  • 接口继承(只继承方法签名)
  • 实现继承(只继承实际的方法)
    ECMAScript中函数没有签名,所以实现继承是ECMAScript 唯一支持的继承方式,主要通过原型链实现。
3.1 原型链

ECMA-262 把原型链定义为 ECMAScript 的主要继承方式。
在这里插入图片描述

3.2 盗用构造函数(对象伪装、经典继承)

在这里插入图片描述
每一个实例都会有自己的colors属性,盗用构造函数的主要缺点,必须在构造函数中定义方法,不可重用,只能用构造函数模式。

3.3 原型式继承

在这里插入图片描述
相当于浅复制,两个实例和obj1共用继承的原型obj1的frends,数据同步。
ES5增加的Object.create()方法来实现原型式继承,这个方法接收两个参数:作为新对象原型的对象,以及给新对象定义额外属性的对象(第二个可选)。
在这里插入图片描述

3.4 组合继承(伪经典继承)综合了原型链和盗用构造函数

组合继承弥补了原型链和盗用构造函数的不足,是JavaScript中使用最多的继承模式。而且组合继承也保留了instanceof操作符和isPrototypeOf()方法识别合成对象的能力。
在这里插入图片描述

3.4 原型式继承

原型式继承本质上执行了一次浅复制,比如我有一个对象,然后在对象的基础上创建了新对象,修改新对象会影响原对象引用值属性。
在这里插入图片描述
object()和Object.create()使用效果一致(后面的Object的O是大写哦)
在这里插入图片描述

3.5 寄生式继承

与原型式继承比较接近,寄生式继承背后的思路类似于寄生构造函数和工厂模式:创建一个实现继承的函数,以某种方式增强对象,然后返回这个对象。
在这里插入图片描述

3.6 寄生式组合继承

在这里插入图片描述

2、类

2.1 类定义

与函数类型相似,定义类也有两种主要方式:类声明和类表达式。
类声明

2.1.1 函数和类定义的异同:

同:函数表达式和类表达式 在求值前都不能引用
在这里插入图片描述
异1:函数声明可以提升,类声明不可以提升:
在这里插入图片描述
异2:函数受函数作用域限制,而类受块作用域限制:
在这里插入图片描述

2.1.2 类的构成

类可以包括构造函数方法、实例方法、获取函数、设置函数和静态方法,也可以为空的类定义。(类名建议大写)
类表达式的名称式可选的,可以通过name的属性获取类表达式的名称字符串,但不能在类表达式作用域外访问到这个标识符。
在这里插入图片描述

2.2 类构造函数

constructor关键字用于在类定义块内部创建类的构造函数。
new实例化类时,有constructor则将直接执行该函数
在这里插入图片描述
类构造函数没有特殊之处,实例化后也会转成普通的实例化方法;类构造函数和普通构造函数主要的区别是,调用类构造函数必须使用new操作符,否则会报错。
如图:
在这里插入图片描述
在这里插入图片描述


待更...
本文内容由网友自发贡献,转载请注明出处:【wpsshop博客】
推荐阅读
相关标签
  

闽ICP备14008679号