【博学谷学习记录】超强总结 用心分享|前端学习w12-js变量/函数提升

82 阅读2分钟

hello 本周复习又来咯 一起来看看变量提升和函数提升的相关内容吧

变量提升

变量提升是 JavaScript 中比较“奇怪”的现象,它允许在变量声明之前即被访问(仅存在于var声明变量)

注意:

  1. 变量在未声明即被访问时会报语法错误

  2. 变量在var声明之前即被访问,变量的值为 undefined

  3. let/const 声明的变量不存在变量提升

  4. 变量提升出现在相同作用域当中,先把var 变量提升到当前作用域于最前面,只提升变量声明, 不提升变量赋值

  5. 实际开发中推荐先声明再访问变量

微信截图_20221210204029.png

ES6 引入了块级作用域,

用let 或者 const声明变量,让代码写法更加规范和人性化。没有变量提升。

函数提升

微信截图_20221210204148.png 函数提升与变量提升比较类似,是指函数在声明之前即可被调用。 总结:

  1. 函数提升能够使函数的声明调用更灵活

  2. 函数表达式不存在提升的现象

  3. 函数提升出现在相同作用域当中

ps:函数提升和变量提升同时出现时,但函数的优先于变量置顶。 当变量名与 函数 名相同的时候,变量名会被先赋值成 函数 然后再被赋值为之前的初始值

函数参数

  1. 动态参数

arguments 是函数内部内置的伪数组变量,它包含了调用函数时传入的所有实参

微信截图_20221210204422.png 总结:

  1. arguments 是一个伪数组,只存在于函数中

  2. arguments 的作用是动态获取函数的实参

  3. 可以通过for循环依次得到传递过来的实参

      // 传入几个值,就求和几个值??
      
      function getSum() {
        // arguments 动态参数 只存在于 函数里面
        // 是伪数组 里面存储的是传递过来的实参,你写几个,我就拿到几个
        // console.log(arguments)  [2,3,4]
        let sum = 0;
        // 遍历数组求和
        for (let i = 0; i < arguments.length; i++) {
          sum += arguments[i];
        }
        console.log(sum);
      }
      getSum(2, 3, 4);
      getSum(1, 2, 3, 4, 2, 2, 3, 4);
    </script>

2、剩余参数允许我们将一个不定数量的参数表

微信截图_20221210204551.png 2. 剩余参数

  1. ... 是语法符号,置于最末函数形参之前,用于获取多余的实参

  2. 借助 ... 获取的剩余实参,是个真数组

      // (...other)或者(...arr)
      function getSum(a, b, ...arr) {
        console.log(arr); // 使用的时候不需要写 ...
      }
      getSum(2, 3);
      getSum(1, 2, 3, 4, 5);

    </script>

展开运算符(…),将一个数组进行展开

典型运用场景: 求数组最大值(最小值)、合并数组等 剩余参数:函数参数使用,得到真数组

展开运算符:数组中使用,数组展开

      const arr1 = [1, 2, 3];
      // 展开运算符 可以展开数组
      // console.log(...arr)

      // console.log(Math.max(1, 2, 3))
      // ...arr1  === 1,2,3

      // 1 求数组最大值
      console.log(Math.max(...arr1)); // 3
      console.log(Math.min(...arr1)); // 1

      // 2. 合并数组
      const arr2 = [3, 4, 5];
      const arr = [...arr1, ...arr2];
      console.log(arr);
      

    </script>

ok 那今天就复习到这里啦