美文网首页
3.对象的解构

3.对象的解构

作者: web_jianshu | 来源:发表于2020-06-28 16:59 被阅读0次
    <!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>
    
      // 对象的解构, 没有顺序的, 只要在左边的对象中写了key值就会提取到;
    
      // 左边的key值必须要与提取对象的属性名要一样;
    
      var person = {
    
        name: "Jack",
    
        age: 19,
    
        gender: "女",
    
        sex: "female"
    
      };
    
      // 解构默认值
    
      // let { sex = 'male' } = person
    
      // console.log(sex); // female
    
      // let { name } = person;
    
      // console.log(name); // Jack
    
      // let { age } = person
    
      // console.log(age); // 19
    
      // ...扩展运算符笼统的获取一些值组成对象 必须用在最后
    
      // let { ...obj1 } = person;
    
      // console.log(obj1); // {name: "Jack", age: 19, gender: "女", sex: "female"}
    
      // let { age, ...obj } = person;
    
      // console.log(obj); // {name: "Jack", gender: "女", sex: "female"}
    
      // let { age: a } = person;
    
      // console.log(age); // age is not defined
    
      // console.log(a); // 19
    
      // let { name: n } = person; // 可以在解构左边的变量后面添加:别名 来给变量设置别名(用于变量简写)
    
      // console.log(name); // ''
    
      // console.log(n); // Jack
    
      // 对象解构的嵌套
    
      // let obj = {
    
      //   p: ["hello", { y: "world" }]
    
      // };
    
      // let {
    
      //   p: [, { y: yy }]
    
      // } = obj;
    
      console.log(yy); // world
    
    </script>
    

    相关文章

      网友评论

          本文标题:3.对象的解构

          本文链接:https://www.haomeiwen.com/subject/kppwfktx.html