ES6系列笔记-解构赋值

简介: ES6系列笔记-解构赋值

1:数组的解构赋值

        //正常写法
        let arr=[10,20,30];
        let  a=arr[0];
        let  b=arr[1];
        let  c=arr[2];
        console.log(a,b,c); 

打印结果如下:


解构赋值的写法

//数组的解构赋值,右边数值的给左边
           let [a,b,c]=[10,20,30]
           console.log(a,b,c); 

打印结果如下:


2:json的解构赋值

//json的解构赋值
let{a,b,c}= {a:11,b:22,c:16};
console.log(a,b,c);

打印结果如下:


json的不同的数据类型混合写法

//json的解构赋值 
let [{a,b},[n1,n2,n3],num,str]=[{a:12,b:15},[12,3,5],6,'qq']
console.log(a,b,n1,n2,n3,num,str);

打印结果如下:


参考

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
    </body>
    <script>
        //正常写法
        /* let arr=[1,2,3];
        //数组的里面的东西分别放在是哪个变量里面
        let  a=arr[0];
        let  b=arr[1];
        let  c=arr[2];
        console.log(a,b,c); */
        //数组的解构赋值,右边的给左边
        /* let [a,b,c]=[1,2,4]
        console.log(a,b,c); */
        //json的解构赋值
        /* let{a,c,d}= {a:11,c:22,d:6};
        console.log(a,c,d); */
        //json的解构赋值
       /* let [{a,b},[n1,n2,n3],num,str]=[{a:12,b:15},[12,3,5],6,'qq']
        console.log(a,b,n1,n2,n3,num,str); */
        //粒度
        /* let [json,arr,num,str]=[{a:12,b:15},[12,3,5],6,'qq']
        console.log(json,arr,num,str); */
        /* 注意 */
        //1:左右两边结构必须一样
        //3:声明和赋值不能分开
    </script>
</html>
相关文章
|
6月前
|
JavaScript
ES6之变量的解构赋值
ES6之变量的解构赋值
ES6学习(2)解构赋值
ES6学习(2)解构赋值
|
2月前
ES6解构赋值
本文介绍了ES6中解构赋值的用法,包括对象和数组的解构,展示了如何从复杂数据结构中提取需要的变量,以及使用重命名和嵌套解构来简化代码。
33 0
ES6解构赋值
|
5月前
|
JSON JavaScript 前端开发
ES6 解构赋值详解
ES6是JavaScript语言的一次重大更新,引入了许多新特性和语法改进,其中解构赋值是一个非常实用和灵活的语法特性。它可以让我们从数组或对象中提取值,并赋给对应的变量,让代码变得更加简洁和易读。本文将深入探讨ES6解构赋值的语法、用法及其在实际开发中的应用。
191 58
ES6 解构赋值详解
|
3月前
es6 的解构赋值
【8月更文挑战第22天】
20 3
|
4月前
ES6 解构赋值【详解】
ES6 解构赋值【详解】
27 0
|
JavaScript 前端开发 网络架构
ES6 解构赋值
ES6 解构赋值
85 0
|
6月前
|
小程序
es6学习笔记(二)解构赋值
es6学习笔记(二)解构赋值
|
11月前
ES6学习(二)—变量的解构赋值
ES6学习(二)—变量的解构赋值
|
JSON JavaScript 前端开发
ES6解构赋值有这一篇就够了
ES6解构赋值有这一篇就够了