js 解构 ES6 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>解构</title>
</head>
<body>
<!-- <script type="text/javascript">
    //数组解构  将数组中的值取出来并一一赋值给不同的变量
    // var arr = [3,4,5];

    // // var a = arr[0];
    // // var b = arr[1];
    // // var c = arr[2];
    // //ES6
    // var [a, b, c] = arr;
    // // var [a, b, c] = [3,4,5];
    // console.log(a, b, c);

    //注意：可以跳过部分值，但是解构的变量 需要使用,占位
    var arr = [3,4,5,6,7];
    var [a,b,c,,e] = arr;
    console.log(a, b, c, e);
</script>
<script type="text/javascript">
    //对象解构  将对象中的属性值取出，并一一赋值给和属性名相同的变量
    var obj = {
        "age":30,
        "sex":"男",
        "say":function(){
            return "hello";
        }
    };
    // var age = obj.age;
    // var sex = obj.sex;
    // ES6
    var {age,sex,say} = obj;
    console.log(age, sex, say);
    console.log( say() );

    //跳过某些值 直接不写解构变量
    var {age,say} = obj;
    console.log(age, say);
    console.log( say() );
    //变量名 必须和对象的成员名对应
    // var {aa,sex} = obj;
    // console.log(aa, sex);
</script> -->

<script type="text/javascript">
    // function f1(m,n,x){
    //     console.log(m, n, x)
    // }
    // f1(3,4,5);

    // var arr = [5,6,7];
    // f1(...arr);
    // 
    
    //函数参数自动解构
    //预期效果：
    function f2(x){
        // console.log(x);
        //解构
        var [m,n,i] = x;
        console.log(m,n,i);
    }
    var arr = [5,6,7];
    f2(arr);
    

    //让函数的形参在接收参数时，自动进行解构
    function f3([m,n,i]){
        // console.log(x);
        console.log(m,n,i);
    }
    var arr = [5,6,7];
    f3(arr);

</script>
</body>
</html>

 

posted @ 2021-02-25 13:03  华北业余选手  阅读(48)  评论(0)    收藏  举报