jQuery3的新特性

前言：自從react,vue等方便的新框架出現后，好多大公司已經摒棄了jquery，但是大部分的公司還在使用，並且jquery的版本還在一直更新中。jquery2.x版本將不再支持IE6/7/8瀏覽器。現在更新到的最新版本3.x增加了一些新特性，也摒棄了一些特性。接下來就總結一下：

一，增加的一些特性

1，for...of循環

可以用來遍歷一個jquery集合所有的DOM元素。

假設你想給頁面中每個input元素分配一個ID,在jQuery3之前，你可以這樣寫：

var inputs = $('input');
for(var i=0;i<inputs.length;i++){
    inputs[i].id = 'input-'+i;
}

jQuery3:

var inputs = $('input');
var i=0;
for(var input of inputs){
   input.id = 'input-'+i++;
}

2,采用requestAnimationFrame()來實現動畫
IE10以上的版本都支持這個函數

3，unwrap()

該方法增加了一個可選的選擇器參數

unwrap([selector])

有了這一變化，你就可以傳入包含一個選擇器表達式的字符串，在父元素進行匹配，如果存在匹配，匹配的子元素被解包，不進行任何操作。
二，被修改的一些特性

1，：visible和：hidden

修改了過濾器的含義，只要元素具有任何布局，包括那些寬度或高度為0的情況，元素被認為是:visible。比如說 <br/>元素和沒有內容的內聯元素可以通過:visible過濾器進行選擇

<div></div>
<br />
console.log($('body:visible').length);

jquery 1.x  2.x中輸出的結果是0, jquery 3中結果是2。
2，data()

該調整主要是為了讓該方法符合DatasetAPI規范，jquery3 強所有屬性的鍵都該駝峰式大小寫形式

<div id="container"></div>

var $elem = $('#container');
$elem.data({
    'my-property':'hello'
});
console.log($elem.data());

在控制台上獲得以下結果：{my-property:"hello"}
在jquery3 {myProperty:"hello"}

3,Deferred對象

jquery 1.x  2.x 中 ，傳入deferred中的回調函數中如果出現未捕獲異常，會導致程序停止執行。而原生的Promise對象並非如此，它會拋出異常，並不斷向上冒泡，直至到達window.onerror。

jquery3遵循原生的Promise對象的模式，因此，拋出的異常將被視為一個失敗狀態（rejection）從而執行失敗回調，完成之后，整個進程 將繼續進行，后續的成功回調將被執行。

var deferred = $.Deferred();
deferrea.then(function(){
   throw new error('an error');
}).then(
    function(){
      console.log('success 1');    
    },function(){
    console.log('failure 1');
}).then{
 function(){
      console.log('success 2');    
    },function(){
    console.log('failure 2');
}
);
deferred.resolve();

在jquery 1.x   2.x中，只有第一個函數會被執行到，由於沒有window.onerror定義任何事件處理函數，所以控制台會輸出“Uncaught Error:an error”,而且進程的執行將終止
而jquery3中，行為完全不同，在控制台中會看到failure1 和success2兩條消息。異常會被第一個失敗回調處理，一旦被處理，則繼續執行下面的成功函數。

三，已廢棄，移除的方法和屬性

1,廢棄了bind(),unbind(),delegate()，undelegate()

用on()方法提供了統一的訪問接口，取代了bind(),delegate(),live()

off()取代了unbind(),undelegate(),die()

2,移除了load(),unload(),error()

3,移除context,support,selector這些屬性

4，bugs修復： width()和height()的返回值不再四舍五入

5，wrapAll()