欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

js解构赋值

程序员文章站 2024-02-20 19:54:34
...

js解构赋值

用法1
交换变量,在没有使用解构前,我们如果要交换两个变量的值,是需要借用第三个变量的,使用解构之后,可以不用通过第三个变量。看下面例子:

        var x = 10,
            y = 20;
        [x, y] = [y, x]
        alert("x:" + x + " y:" + y)

解构:
js解构赋值
用法2:
函数可以返回多个值,在传统的函数中,函数一般只能返回一个值,但是通过解构赋值,函数可以返回多个值。看下面例子:

        function show() {
            return ["结果1", "结果2", "结果3"];
        }

        var [a, b, c] = show();
        alert(a + "," + b + "," + c);

结果:
js解构赋值

用法3:
函数定义参数,传入的参数的顺序可以改变。在传统函数中,我们定义了函数形参,在传入实参的时候,需要根据传入的形参顺序传入。解构赋值可以改变传入参数顺序。看下面例子。(注意形参和实参有大括号包裹着)

        function showSelf({name,age,sex}) {
            alert("我叫" + name + ",今年" + age + ",是一位" + sex + "性");
        }
        showSelf({sex: "男",name: "小明",age: 18})

结果:
js解构赋值
用法4
参数可以带默认值。如果函数对参数设置默认值,我们不传入对应的实参的话,函数会输入我们设置的默认值。看下面例子:

        function showSelf({name,age,sex="男"}) {
            alert("我叫" + name + ",今年" + age + ",是一位" + sex + "性");
        }
        showSelf({,name: "小明",age: 18})

结果:
js解构赋值
用法5:
快速取出数组中某个元素。

        var arr = [10, 20, 30, 40, 50];
        var {
            0: first,
            4: last
        } = arr;
        console.log(first);
        console.log(last == arr[4]);

结果:
js解构赋值

相关标签: JavaScript