6.对象的扩展
2020-06-28 本文已影响0人
web_jianshu
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body></body>
</html>
<script>
// 对象的扩展:
// 1、对象的简写:当属性名和属性值相同时,可以省略属性值, 方法的简写直接把function去掉
// 2、对象的属性名(原本是字符串,只是书写可以省略双引号)允许为变量(vue, react) [变量]
// 方法:Object.is 和 === 一样
// Object.assign合并对象,对象的浅拷贝
// 对象的扩展运算符: 把对象转成用逗号隔开表达式
let name = "Jack";
let key = "age";
let person = {
name,
[key]: 19, // 属性名是变量了 === age: 19
sayHi() {
console.log("hello world");
}
};
// console.log(person.name); // Jack
// person.sayHi()
// 属性名可以为表达式
// console.log(person.age); // 19
// console.log(Object.is(1, '1')); // false
// console.log(Object.assign(person, { gender: "男" }, { hobbies: "女" })); // {name: "Jack", age: 19, gender: "男", hobbies: "女", sayHi: ƒ}
// let proto = { a: 1 };
// let obj = { x: 10 };
// Object.setPrototypeOf(obj, proto); // 继承的时候 JS面向对象的课程的时候
// console.log(obj, proto); // obj的__proto__指向proto 也就是说obj继承proto
// for (let k in person) {
// console.log(person[k]);
// }
// for (let value of Object.values(person)) {
// console.log(value);
// }
// for (let k of Object.keys(person)) {
// console.log(k);
// }
// 扩展运算符 1、拷贝对象 2、合并对象 3、与解构赋值配合
// let p1 = { ...person };
// console.log(p1); // {name: "Jack", age: 19, sayHi: ƒ}
// let p2 = { love: "you", ...person, like: "myself" };
// console.log(p2); // {love: "you", name: "Jack", age: 19, like: "myself", sayHi: ƒ}
// let { love, ...p } = p2;
// console.log(p); // {name: "Jack", age: 19, like: "myself", sayHi: ƒ}
// 函数参数解构
// function test({ name, age, sayHi }) {
// // 相当于 let { name, age, sayHi } = person 或者 let [{ name, age, sayHi }] = arguments
// console.log(name, age, sayHi);
// }
// test(person);
// Object.entries() 把对象或数组转化为二维数组 元素是所有健和值组成的数组
// 成员是参数对象自身的所有可遍历属性的健值对数组
let OBJ = { name: "jack", age: 19, hobbits: "吃", like: "dance" };
let OBJARR = Object.entries(OBJ);
// console.log(OBJARR); // [["name", "jack"], ["age", 19], ["hobbits", "吃"], ["like", "dance"]]
for (let [key, value] of OBJARR) {
console.log(`${key}: ${value}`);
}
</script>
