麻麻不会告诉你的几点 Javascript 知识（一）

[YIXUNFE]

麻麻不会告诉你的几点 Javascript 知识（一）

### 直接使用 id 获取元素

当给 HTML 元素一个 id 后，

<div id="foo"></div>

我们就可以使用 getElementById 方法获取该 DOM 对象。而除了这种方式外，浏览器还提供了更加方便方法。

window.foo === document.getElementById('foo')
// true

直接使用 window 对象下面的 foo 属性即可获取元素。

我们给 HTML 元素添加的 id 后会给 window 对象创建一个同名的属性，如果这个 id 是已有的属性则忽略，比如 id="alert":

window.alert === document.getElementById('alert')
// false

另外要说的是，大家没必要对每一个 JS 会用到的元素都添加 id。因为查找的结果可以被赋值给变量保存起来，所以查找过程中的性能损耗不需要太苛求。而页面一加载就造成难以预计的全局污染才是令人担忧的，这也从根本上造成了我们难以使用 window.foo 这种方式查找元素。毕竟相对于去改变一个 DOM 对象的属性来说，改变 window 对象的属性要方便的多，有时候甚至是不经意的。

### setTimeout 中的参数

setTimeout 方法是大家都再熟悉不过的，我们知道它有两个参数，一个是回调方法，一个是延迟时间。

setTimeout(callback[, time])

其实 setTimeout 方法还可以填入更多的参数，这些参数会被传入 callback 方法中。

比如：

setTimeout(alert, 0, 'abc')
//alert abc

这里我们给 alert 方法传入了字符串 abc 作为参数。如果需要给 callback 传入多个参数，依次用逗号分隔就可以了。

### label 声明

label 声明可以标记一个循环并可以和 break 或 continue 配合使用。

来看一个使用 label 的例子:

var i, j;

loop1:
for (i = 0; i < 3; i++) {      //第一个 for 循环被标记为 loop1
   loop2:
   for (j = 0; j < 3; j++) {   //第二个 for 循环被标记为 loop2
      if (i === 1 && j === 1) {
         break loop1;
      }
      console.log("i = " + i + ", j = " + j);
   }
}

//   "i = 0, j = 0"
//   "i = 0, j = 1"
//   "i = 0, j = 2"
//   "i = 1, j = 0"

例子中有两个循环，在满足条件后，使用 break loop1 直接跳出了外层循环。比使用两次 break 要方便多了

### 利用 apply 对数组取极值

给你一个全是数字的数组，如何对数组取极值呢？

你可能会说使用 sort 排序后取值，对，这是一种方法。

然而我们可以利用 apply 方法更加方便的求出数组中的极值。

我们知道 Math.max 和 Math.min 方法都接受两个或多个参数。而恰巧 apply 方法可以以数组形式对一个函数进行多参数传参。于是乎：

var a = [4, 100, 12, 46, 87, 90]

console.log(Math.max.apply(null, a))
//100

console.log(Math.min.apply(null, a))
//4

使用这种方法取值，都不需要对数组进行排序哦。另外这里给 apply 方法的第一个参数为 null 是因为我们不需要特别指定其上下文，即使用 window 作为上下文。

## Thanks

[cssmagic]

“直接使用 id 获取元素” 这个真的不推荐，老 IE 遗留的非标准行为，忘了就忘了吧 😃