javaScript 基础知识汇总（九）

1、Rest 参数与 Spread 操作符

　　当我们在代码中遇到“..."时，它不是Rest参数就是Spread操作符

　　区分方法：

　　若...出现在函数的参数列表，那它表示的就是Rest参数，它会把函数多余的实参收集到一个数组中。

 1 function sumAll(...args) { // 数组变量名为 args

 2   let sum = 0;

 3

 4   for (let arg of args) sum += arg;

 5

 6   return sum;

 7 }

 8

 9 alert( sumAll(1) ); // 1

10 alert( sumAll(1, 2) ); // 3

11 alert( sumAll(1, 2, 3) ); // 6

　　若... 出现在函数调用或类似的表达式中，那么它就是Spread操作符，它会把一个数组展开为逗号分隔的元素列表。

1 let arr = [3, 5, 1];

2

3 alert( Math.max(...arr) ); // 5（Spread 操作符把数组转为参数列表）

1 let str = "Hello";

2

3 alert( [...str] ); // H,e,l,l,o

2、旧时的“var”

　　“var”没有块级作用域

 function sayHi() {

   if (true) {

     var phrase = "Hello";

     let test = "aa"

   }

   alert(phrase); // works

   alert(test);//报错 test is not defined

 }

 sayHi();

 alert(phrase); // 报错：phrase is not defined

　　“var” 在函数开头被处理

 function sayHi() {

   phrase = "Hello";

   alert(phrase);

   var phrase;

 }

 和下面等同

 function sayHi() {

   var phrase;

   phrase = "Hello";

   alert(phrase);

 }

 或者代码块被忽略

 function sayHi() {

   phrase = "Hello"; // (*)

   if (false) {

     var phrase;

   }

   alert(phrase);

 }

 此时的变量仍可以被访问

3、全局对象

　　概念：全局对象提供在任何地方使用的变量和函数。大多情况下，这些局部变量内置与语言或主机环境中。浏览器中它被命名为window。

　　window 对象

　　1）作为全局对象外，还有浏览器窗口功能，

　　alert(window.innerHeight);//显示浏览器窗口高度

　　window.open('http://www.baidu.com')//打开一个新窗口

　　2）顶级var 变量和函数声明后自动成为window属性

　　var x = 5;

　　alert(window.x)//5 这样可以访问x

　　但是 let/const 声明不会发生这种情况，因为这两个的声明不会给window 创建属性

　　3) 正常情况下，所有脚本代码共享相同的全局作用域

 <script>

   var a = ;

   let b = ;

 </script>

 <script>

   alert(a); //

   alert(b); //

 </script>

　　4）全局范围内 this 的值为 window

　　alert(this);//window

　　这样会可能导致命名冲突

　　所以现在有了一个解决办法就是给 type设置 “module” 属性

//在一个模块中， var x 不会成为window属性

    <script type="module">

  var x = ;

  alert(window.x); // undefined

</script>

//两个模块的变量彼此不可见

    <script type="module">

  let x = ;

</script>

<script type="module">

  alert(window.x); // undefined

  alert(x); // 错误：未声明的变量

</script>

//在模块中 this 的顶级变量为 undefined

<script type="module">

  alert(this); // undefined

</script>

4、函数对象

　　属性 “name"

 function sayHi() {

   alert("Hi");

 }

 alert(sayHi.name); // sayHi

　　属性 "length"

　　这个属性是用来返回函数传入参数的个数

function f1(a) {}

function f2(a, b) {}

function many(a, b, ...more) {}

alert(f1.length); //

alert(f2.length); //

alert(many.length); //

　　但是余参不参与计数

　　自定义属性

 function sayHi() {

   alert("Hi");

   // 我们记录一下运行次数

   sayHi.counter++;

 }

 sayHi.counter = ; // 初始值

 sayHi(); // Hi

 sayHi(); // Hi

 alert( `调用了 ${sayHi.counter} 次` ); // 调用了 2 次

　　命名函数表达式

　　1）这个名字允许在函数内部引用自己

　　2）在函数外部是不可见的

 let sayHi = function func(who) {

   if (who) {

     alert(`Hello, ${who}`);

   } else {

     func("Guest"); // 使用 func 再次调用自己

   }

 };

 sayHi(); // Hello, Guest

 // 但这个无法生效

 func(); // Error, func is not defined（在函数外不可见）

巴特西

javaScript 基础知识汇总（九）

1、Rest 参数与 Spread 操作符

2、旧时的“var”

3、全局对象

4、函数对象

最新文章

热门文章

巴特西

javaScript 基础知识汇总（九）

1、Rest 参数 与 Spread 操作符

2、旧时的“var”

3、全局对象

4、函数对象

最新文章

热门文章

1、Rest 参数与 Spread 操作符