解构赋值

2023-03-02  本文已影响0人  扶得一人醉如苏沐晨

一、获取对象属性值

如果解构不成功,变量值等于undefined

const user = {
    userName: "yyyyy",
    blog: "xxxxx"
}
const {userName, blog} = user;
console.info(userName);
console.info(blog);

二、获取嵌套对象的属性值

const user = {
    userName: "yyyyy",
    blog: "xxxxx",
    details: {
        nickName: "yyyyy",
        address: "中国北京",
        signature: "勿以善小而不为,勿以恶小而为之"
    }
}
const { userName, blog, details: { signature } } = user;
console.info(userName);
console.info(blog);
console.info(signature);

三、设置默认值

const user = {
    userName: "yyyyy",
    blog: "xxxxx",
    status: "online"
}
const { userName, blog, status } = user;
console.info(userName);
console.info(blog);
console.info(status);

四、使用别名

const user = {
    userName: "yyyyy",
    blog: "xxxxx",
}
const { userName: name, blog: url } = user;
console.info(name);
console.info(url);

五、定义新变量

const user = {
    userName: "yyyyy",
    blog: "xxxxx",
}
const { userName, blog, message = `我是${userName},我的博客地址是:${blog}` } = user;
console.info(userName);
console.info(blog);
console.info(message);

六、函数中的解构赋值

1、解构赋值传参

const user = {
    userName: "yyyyy",
    blog: "xxxxx",
};
function display({userName, blog}) {
    let message = `大家好,我是${userName},我的博客地址是:${blog}`;
    console.info(message);
}
display(user);

七、数组解构

let [a, b] = [1, 2];
console.info(a);
console.info(b);
上一篇 下一篇

猜你喜欢

热点阅读