JavaScript结构赋值和对象赋值(let指令和const概念)

let指令

概念:

1.let 没有变量提升的说法 所以没有预解析的说法

2.let 有局部作用域的说法和var作用不同的是 var 的作用域仅在函数中有效 let 所有{} 都有效

3.let 暂时性死区 说的就是 必须要先声明在使用 否则就会死区

4.let 不能重复声明 和java一样

const 常量

只在声明所在的块级作用域内有效

const命令声明的常量不提升

存在暂时性死区,

只能在声明的位置后面使用声明的常量,

也与let一样不可重复声明

初始化必须要赋值

不能修改

数组解构赋值

 //可嵌套//  let arr = [1,[[2],3]];  -- 必须掌握//  let [a,[[b],c]]=arr;//  console.log(a+"-"+b+"-"+c);//可忽略//  let [,b,] = [1,2,3];//  console.log(b);//不完全解构  连空格都不留//  let [a,b] = [1,2,3];//  console.log(a);//  console.log(b);// let [a, [b], c] = [1, [2, 3], 4];//剩余运算符  只解构了一部分值剩余不想解构 可以采用...let [a, ...b] = [1, [2, 3], 4];

​    console.log(a); //1

​    console.log(b);//[[2,3],4]// console.log(c);//解构默认值//   let [x,y] = ['a']; //   console.log(x);//'a'//   console.log(y); // 如果没有的解构 那么就统一都是undefinedlet [x, y = 'b'] = ['a'];

​    console.log(x); // 'a'

​    console.log(y); 'b'

对象的解构赋值

基本写法
   // 最基本的对象解构赋值var obj = {

​      name: 'hello',

​      age: 18};



​    console.log(obj.name + obj.age); //未解构的取值方式

​    let {

​      age,

​      name, aaa

​    } = obj;

​    console.log(name + age + aaa); //解构的取值方式  aaa没有就是undefined
多种写法
  //可嵌套// let obj = {   -- 必须要掌握//     p:['hello',{y:'world'}]// };// let {p:[x,{y}] }  = obj;// console.log(x+y); //helloworld//可忽略  // let obj = {//     p:['hello',{y:'world'},'es6']// };// let {p:[x,{y}] }  = obj;// console.log(x+y);//helloworld//不完全解构 // let obj = {//     p:['hello',{y:'world'}]// };// let {p:[x,{y},z] }  = obj;// console.log(x+y+z); //hello world undefined//剩余运算符

  //  let obj = {a:10,b:20,c:30,d:40};

  //  let {a,b,...rest} = obj

  //  console.log(a) // 10

  //  console.log(b)//20

  //  console.log(rest)//{c:30,d:40}



  //解构默认值

  // let obj = {a:3};

  // 原本的值优先  

  let {a=10,b=20} = {a:3};

  console.log(a);//3

  //如果 原本没有的 那么就去解构 如果解构没有默认值那就undefined 

  //如果有默认一个值 比如b=20那么就取这个默认值

  console.log(b);//20

   

  // a:aa  aa表示给a属性重写一个变量名称叫aa  避免和上面的a重复命名

  //因为let不允许重复定义同一个变量名

  let {a:aa,b:bb=5} = {a:3};

  console.log(aa);//3 

  console.log(bb);//5 


函数解构赋值
 // let arr1 = [1, 2];
        // function show(arr) {
        //     console.log(arr[0], arr[1]);
        // }
        // show(arr1);

        //函数解构赋值的基本用法  -- 必须要掌握
        // let arr1 = [1, 2];
        // function show([x, y]) {
        //     console.log(x, y);
        // }
        // show(arr1);

        //函数结构赋值 - 默认值

        // var  a = { a1: 10 };
        // function move(a) {
        //     console.log(a.a1);
        // }
        // move(a);

        // 右边的{}如果没在调用方法的时候没有传参数那么就以左边{}里面的值为准 -- 必须要掌握
        // function move({x=0,y=0}={}) {
        //     console.log(x,y);
        // }

        // move({x:3,y:10}); // 3 ,10
        // move({x:3});
        // move({});//0,0
        // move();//0,0  




        // function move({ x, y } = { x: 0, y: 0 }) { -- 必须要掌握
        //     console.log(x, y);
        // }

        // //以调用的参数为准 有参打印的就那个参数 
        // move({ x: 3, y: 10 }); //3 10
        // move({ x: 3 }); //3 undefined
        // move({}); //undefined undefined
        // move();//0,0  // 会默认调用  { x: 0, y: 0 }





        //    function show(x,y="你好"){
        //           alert(x+y);
        //    }

        //   show('张三'); // 张三你好
        //   show('张三',"你好"); //张三你好
        //   show('张三',"");  //空字符串 也算一个参数
        //   show('张三',);  //没有写页算一个参数
        //   show('张三',null);  //没有写页算一个参数  null 也算一个值

        // function foo({x, y = 5}) { -- 必须要掌握
        //       console.log(x, y);
        //     }
        //     foo({}) // undefined 5
        //     foo({x: 1}) // 1 5
        //     foo({x: 1, y: 2}) // 1 2
        //     foo() // TypeError: Cannot read property 'x' of undefined



        // 局限性

        //不报错
        // function show1(x,x,y){
        //     console.log("益达 吃完身材好");
        // }
        // show1(1,1,2);

        // //如果 报错 你的参数中存在默认值 那么 参数列表如果存在同名 就会报错
        // function show(x,x,y=5){
        //     console.log("益达 吃完身材好");
        // }
        // show(1,1,2);



        //参数默认值的位置
        // function foo(x = 1, y) {console.log(x,y);}
        // //foo(); // [1, undefined]
        // //foo(2); // [2, undefined])
        // //foo(, 1); // 报错
        // //foo(undefined, 1); // [1, 1]
        //  foo(null, 1);

        console.log((function (a, b, c = 1) { }).length);//如果有默认值的 不算长度

        console.log((function (a, b = 1, c) { }).length);//如果 默认值在中间 那后面的不算
        console.log((function (a = 1, b, c) { }).length);


        //     

        //参数默认值的位置
        function foo(x = 1, y) { console.log(x, y); }
        foo(); // [1, undefined]
        //foo(2); // [2, undefined])
        //foo(, 1); // 报错
        //foo(undefined, 1); // [1, 1]
        //foo(null, 1);
        //函数的 length 属性
        console.log((function (a) { }).length) // 1
        console.log((function (a = 5) { }).length) // 0
        console.log((function (a, b, c = 5) { }).length) // 2


        //作用域
        var x = 5;
        function f(x, y = x) { console.log(y); }
        f(10); // 10
        //rest 参数实现求和
        function add(...values) { //...会把调用函数的参数变成数组
            let sum = 0;
            for (var val of values) { sum += val; }
            console.log(sum);
        }
        add(1, 2, 3) // 6





函数结构赋值局限性
  // 局限性
   // 参数变量是默认声明的,所以不能用let或const再次声明
    //使用参数默认值时,函数不能有同名参数
        function foo(x = 5) {
            let x = 1; // error
            const x = 2; // error
        }
        foo();

    //不报错
    function show1(x,x,y){
        console.log("李四 身材好");
    }
    show1(1,1,2);

    //如果 报错 你的参数中存在默认值 那么 参数列表如果存在同名 就会报错
    function show(x,x,y=5){
        console.log("李四 身材好");
    }
    show(1,1,2);
  • 10
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值