ES6——字符串，数值，布尔值以及函数参数的解构赋值

最新推荐文章于 2023-04-14 10:58:31 发布

DangR-Jisoo

最新推荐文章于 2023-04-14 10:58:31 发布

阅读量301

点赞数

分类专栏：前端 JavaScript ES6

本文链接：https://blog.youkuaiyun.com/Angela_Connie/article/details/111007713

版权

前端同时被 3 个专栏收录

45 篇文章

订阅专栏

JavaScript

32 篇文章

订阅专栏

ES6

8 篇文章

订阅专栏

本文介绍了ES6中字符串、数值、布尔值及函数参数的解构赋值方法。通过实例展示了如何将字符串转换为类数组对象进行解构，如何处理数值与布尔值的解构赋值，并解释了为什么某些情况下会出现undefined。此外还介绍了如何利用解构赋值简化函数参数处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ES6——字符串，数值，布尔值以及函数参数的解构赋值

字符串的解构赋值
之所以字符串能够被解构，是因为字符串被转换成了一个类数组的对象

        let [a, b, c, d, e] = 'Jisoo';
        console.log(a); //J
        console.log(b); //i
        console.log(c); //s
        console.log(d); //o
        console.log(e); //o

类数组都有length属性，因此还可以对这个属性进行解构赋值

        let {
            length: len
        } = 'jisoo';
        console.log(len);//5

数值和布尔值的解构赋值
如果等号右边是数值或者布尔值时，会先将其转换为对象

        let {
            prop: x
        } = 123;
        console.log(x); //undefined(123被转换为对象)
        let {
            prop1: y
        } = true;
        console.log(y); //undefined(true被转换为对象)
        let {
            prop2: z
        } = undefined;//undefined不能转换为对象，所以报错
        console.log(z); //Error

函数参数的解构赋值

        function add([x, y]) {
            return x + y;
        }
        var sum = add([1, 2]);
        console.log(sum);

函数add()参数表面是一个数组，但实际上在传入参数的那一刻，数组参数就被解构成变量x和y
函数参数的解构也可以使用默认值

        function move({
            x = 0,
            y = 0
        } = {}) {
            return [x, y];
        }
        var x = move({
            x: 3,
            y: 8
        });
        console.log(x); //[3,8]
        var y = move({
            x: 3
        });
        console.log(y); //[3,0]
        var z = move({}); //
        console.log(z); //[0,0]