对象的基本操作
let hs = {
name: "张三",
};
console.log(hs.name);
// 给对象添加元素
hs.sex = "男";
console.log(hs);
// 删除对象的元素
delete hs.sex;
console.log(hs);
对象的引用传址
let hd = {
name: "张三",
};
let user = hd;
user.name = "lili";
console.log(hd.name); // lili
引用类型的赋值, 传递的值地址, 而不是值.
点语法
let user = {
name: "li",
age: 16,
};
// 使用点语法展开
let hd = { ...user, sex: "男" };
console.log(user);
console.log(hd);
// 展开语法
function upload(params) {
let config = {
type: "*.jpeg, *.png",
size: 9999,
};
// 使用展开语法
config = { ...config, ...params };
// 点语法的展开结构
// config = {
// // 默认config的参数
// type: "*.jpeg, *.png",
// size: 9999,
// // 传递参数params的参数
// type: ".jpg",
// size: 99,
// };
console.log(config);
}
upload({ size: 99, type: ".jpg" });
解构赋值
let hd = {
name: "lili",
age: 14,
};
// 解构赋值
let { name, age } = hd;
// let { name, age } = { name: "lili", age: 14 };
console.log(name, age);
多层的对象解构赋值
// 多层次的对象解构赋值
let hdr = {
name: "join",
lessons: {
title: "javascript",
},
};
// 进行解构赋值
let {
name,
lessons: { title },
} = hdr;
// lessons:{title} 等同如下语句:
// let { title } = { title: "javascript" };
console.log(name, title);
解构默认值
// 解构默认值
function createElement(options = {}) {
// 设置默认值
let {
width = 200,
height = 200,
backgroundColor = "pink",
} = options;
const div = document.createElement("div");
div.style.width = width + "px";
div.style.height = height + "px";
div.style.backgroundColor = backgroundColor;
document.body.appendChild(div);
}
createElement();
// Object.assign()将两个对象内的数据合并
let newObj = Object.assign({ a: 1 }, { b: 2 });
console.log(newObj);
function hd(params) {
let options = {
size: 199,
};
// 使用方法设置默认值
options = Object.assign(options, params);
console.log(options);
}
hd({ type: "png", size: 100 });
函数传参的解构特性
// 函数参数的解构特性
// 传递参数可以解构传入, 也可以正常传入参数
function hd(name, { sex, age }) {
console.log(name, sex, age);
}
hd("lili", { sex: 1, age: 39 });
// 全部以解构传参
function fn({ name, sex, age }) {
console.log(name, sex, age);
}
fn({ name: "join", sex: 0, age: 18 });
hasOwnProperty() 方法
let hd = {
name: "lili",
sex: 1,
age: 1,
};
console.log(hd);
// hasOwnProperty方法用来查看自己本身是否拥有某些属性
console.log(hd.hasOwnProperty("name")); // true
delete hd.age;
console.log(hd.hasOwnProperty("age")); // false
// 自己本身并没有valueOf这个方法, 原型链上有此方法
console.log(hd.hasOwnProperty("valueOf")); // false
// 查看原型链上是否有此方法
console.log("valueOf" in hd); // true