javascript之面向对象

对象

合并

对象合并也称为mixin,js提供了方法Object.assign.
Object.assign执行的是浅复制，在有多个源的情况下，如果key有相同的，则以最后的一次为准
还有在复制过程中，中间出现异常，不会回退，也就是会出现出现只复现部分的问题

相等判定

Object.is可以用于之前对于使用===不能正确处理的情况

console.log(Object.is(+0, -0)) //输出为false
console.log(Object.is(+0, 0))//输出为true
console.log(Object.is(-0, 0))//输出为false

console.log(Object.is(NaN, NaN))//输出为true

增强的对象语法

• 属性简写
  在属性名和变量名一致时，可以省略属性名

let name = "Matt"
let person = {
    name
};

console.log(person)//输出为{ name: 'Matt' }

• 可计算属性
  在通过对象字面量方式创建对象时可以动态属性赋值

const nameKey = "name"
const ageKey = "age"
const jobKey = "job"

let person = {
    [nameKey]: "Matt",
    [ageKey]: 27,
    [jobKey]: "Software engineer"
}

console.log(person)//输出{ name: 'Matt', age: 27, job: 'Software engineer' }

可计算属性支持表达式运算

const nameKey = "name"
const ageKey = "age"
const jobKey = "job"
let uniqueToken = 0

function getUniqueKey(key)
{
    return `${key}_${uniqueToken++}`;
}

let person = {
    [getUniqueKey(nameKey)]: "Matt",
    [getUniqueKey(ageKey)]: 27,
    [getUniqueKey(jobKey)]: "Software engineer"
}

console.log(person)//输出为{ name_0: 'Matt', age_1: 27, job_2: 'Software engineer' }

• 方法名简写
  与属性简写类似

let person = {
    sayName(name) {
        console.log(`My name is ${name}`);
    }
}

person.sayName('Matt')

对象解构

就是使用与对象相匹配的结构来实现对对象赋值

let person = {
   name:"Matt",
   age: 27
};

let {name: personName, age: personAge} = person
console.log(personName, personAge)

上面代码表示将person中的name赋值给personName,age赋值给personAge
可以使用属性简写语法

let person = {
   name:"Matt",
   age: 27
};

let {name, age} = person
console.log(name, age)

在解析过程中，如果原对象的属性不存在，则赋值为undefined

let person = {
   name:"Matt",
   age: 27
};

let {name, job} = person
console.log(name, job) //输出为Matt undefined

对于上面因为原对象属性不存在导致赋值为undefined时，可以为其指定默认值

let person = {
   name:"Matt",
   age: 27
};

let {name, job = "Software engineer"} = person
console.log(name, job)//输出为Matt Software engineer

解构内部是通过函数ToObject将源数据结构转为对象，那么null和undefined解析进会抛出异常

let {_} = undefined
会抛出异常
let {_} = undefined
     ^

TypeError: Cannot destructure property '_' of 'undefined' as it is undefined.
    at Object.<anonymous> (/Users/wuli06/test.js:2:6)
    at Module._compile (node:internal/modules/cjs/loader:1275:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1329:10)
    at Module.load (node:internal/modules/cjs/loader:1133:32)
    at Module._load (node:internal/modules/cjs/loader:972:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:83:12)
    at node:internal/main/run_main_module:23:47

Node.js v19.9.0


let {_} = null
let {_} = null
     ^

TypeError: Cannot destructure property '_' of 'null' as it is null.
    at Object.<anonymous> (/Users/wuli06/test.js:2:6)
    at Module._compile (node:internal/modules/cjs/loader:1275:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1329:10)
    at Module.load (node:internal/modules/cjs/loader:1133:32)
    at Module._load (node:internal/modules/cjs/loader:972:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:83:12)
    at node:internal/main/run_main_module:23:47

Node.js v19.9.0

解构赋值并没有要求在解构时声明变量，也可以先声明， 再解构赋值，此时要求解析赋值用括号括起来

let personName, personAge

let person = {
    name:"Matt",
    age: 27
};

({name:personName, age:personAge} = person)
console.log(personName, personAge)

嵌套解构要求外层属性存在，否则会抛出异常，源和目的都需要满足

let person = {
    job: {
        title: "Software engineer"
    }
};

let personCopy = {};

({foo: {
    bar: personCopy.bar
    }
} = person);
抛出异常

bar: personCopy.bar
         ^

TypeError: Cannot read properties of undefined (reading 'bar')
    at Object.<anonymous> (/Users/wuli06/test.js:12:10)
    at Module._compile (node:internal/modules/cjs/loader:1275:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1329:10)
    at Module.load (node:internal/modules/cjs/loader:1133:32)
    at Module._load (node:internal/modules/cjs/loader:972:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:83:12)
    at node:internal/main/run_main_module:23:47


let person = {
    job: {
        title: "Software engineer"
    }
};

let personCopy = {};

({job: {
    title: personCopy.job.bar
    }
} = person);
抛出异常
title: personCopy.job.bar
                      ^

TypeError: Cannot set properties of undefined (setting 'bar')
    at Object.<anonymous> (/Users/wuli06/test.js:12:23)
    at Module._compile (node:internal/modules/cjs/loader:1275:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1329:10)
    at Module.load (node:internal/modules/cjs/loader:1133:32)
    at Module._load (node:internal/modules/cjs/loader:972:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:83:12)
    at node:internal/main/run_main_module:23:47

对象创建方式

工厂模式

通过函数来创建对象，填充属性值

function createPerson(name, age, job)
{
    let o = new Object();
    o.name = name;
    o.age = age;
    o.job = job;
    o.sayName = function() {
        console.log(this.name);
    }

    return o;
}

let person1 = createPerson("Nicholas", 29, "Software engineer");
let person2 = createPerson("Greg", 27, "Doctor");

person1.sayName();
person2.sayName();