对象--学习笔记

• 学习材料来源于 后盾人

理解概念

// 面向过程的开发
let name = "houdunre.com";
const grade = [
  { lesson: "java", score: 90 },
  { lesson: "js", score: 90 },
];
function averge(name1, grade) {
  const averageScore = grade.reduce((t, v) => t + v.score, 0);
  return name1 + "average" + averageScore / grade.length;
}
console.log(averge(name, grade));

// 面向对象的开发
// 可以看到，average 函数减少了参数的传递，结构清晰，也不用担心函数名重复
let user = {
  name: "houdunren",
  grade: [
    { lesson: "java", score: 90 },
    { lesson: "js", score: 90 },
  ],
  average: function () {
    const res = this.grade.reduce((t, v) => t + v.score, 0) / this.grade.length;
    return this.name + " average score " + res;
  },
};
console.log(user.average());

OOP 封装、抽象、继承、多态

• 对象是属性和方法的集合即 封装
• 将复杂功能隐含在内部，只开放给外部少量功能，更改对象内部的复杂逻辑不会对外界产生影响。即 抽象
• 通过代码复用，减少代码冗余。即 继承
• 根据不同形态的对象产生不同的结果。即 多态

对象的 引用特性

对象和函数、数组一样，属于引用类型、即 复制只会复制引用地址。

下面的代码解释了什么叫引用特性

let hd = { name: "houdun" };
let xdm = hd;

xdm.name = "xdm";
console.log(hd.name); // 此时打印的是 ‘xdm’

对象中的 this

this 始终指的是当前对象的引用，

对象的嵌套结构

const hd = {
  hd: {
    title: "houdunre.com",
  },
};

const {
  hd: { title },
} = hd;
console.log(title);

对象属性的方法

• Object.hasOwnProperty() // 监测 对象自身是否 包含特定的属性，监测范围不包括 原型链上继承的属性
• Object.getOwnPropertyNames() // 获取对象自身的属性名集合

const obj = {
  names: "2",
};
// 监测 对象自身是否 包含特定的属性，监测范围不包括 原型链上继承的属性
console.log(obj.hasOwnProperty("names"));
console.log(Object.getOwnPropertyNames(obj)); // 打印 names

assign 对象分配

所有可枚举属性的值从一个或多个源对象分配到目标对象

const target = { a: 1, b: 2}
const source = { b: 3, c: 4}

// Object.assin 返回值是target
console.log(Object.assign(target, source));

对象的key 是可以动态计算的

let id = 0;
const user = {
    [`id-${id++}`]: id,
    [`id-${id++}`]: id,
    [`id-${id++}`]: id,
}
// 对象的key 可以通过 [] 计算出来。
console.log(user); // { 'id-0': 1, 'id-1': 2, 'id-2': 3 }

对象属性的描述

JS 中可以对属性的访问特性进行控制。 描述符有一下几种

• configurable: 能否使用 delete、能否修改属性特性、能否修改访问属性，默认值：true
• enumerable: 对象是否可遍历
• writable： 对象属性是否可以修改
• vale: 对象属性的默认值

Object.defineProperty 设置属性特征

• Object.defineProperties 可以设置多个属性，

"use strict";
const user = {
  name: "houdun",
};

Object.defineProperty(user, "name", {
  writable: false,
  enumerable: false,
  value: "default value",
  configurable: false,
});

console.log(user.name);
delete user.name;

禁止添加属性

// 禁止添加属性
"use strict";
const user = {
  name: "houdun",
};

Object.preventExtensions(user);
user.age = 10; // TypeError: Cannot add property age, object is not extensible

判断是否能添加属性

const usre = {
  name: "houdun",
};
console.log(Object.isExtensible(usre)); // true
Object.preventExtensions(usre)
console.log(Object.isExtensible(usre)) // false

封闭对象

"use strict";
const user = {
  name: "houdunren",
};

Object.seal(user);
console.log(Object.getOwnPropertyDescriptors(user, null, 2));
//  configurable: false

console.log(Object.isSealed(user)) // true

冻结对象

"use strict";
const user = {
  name: "houdunren",
};

Object.freeze(user)
console.log(Object.getOwnPropertyDescriptors(user))
// writable: false, configurable: false

console.log(Object.isFrozen(user)) // true