資訊專欄INFORMATION COLUMN
摘要：返回一個由原數(shù)組中的每個元素調用一個指定方法后的返回值組成的新數(shù)組。方法測試數(shù)組中的某些元素是否通過了指定函數(shù)的測試，返回值非常實用的功能，判斷數(shù)組中是否某元素符合特定條件。
ECMAScript 5發(fā)布于2009年12月。ECMAscript 5.1版(下文稱ES5)發(fā)布于2011年6月，，并且成為ISO國際標準（ISO/IEC 16262:2011）
http://www.ecma-international...
ECMAScript 5.1 是ECMAScript(基于JavaScript的規(guī)范)標準最新修正。 與HTML5規(guī)范進程本質類似，ES5通過對現(xiàn)有JavaScript方法添加語句和原生ECMAScript對象做合并實現(xiàn)標準化。實用特性 Object
該方法直接在一個對象上定義一個新屬性，或者修改一個已經存在的屬性， 并返回這個對象。Object.defineProperties()與其一樣,只是可以同時定義多個屬性。
該方法允許精確添加或修改對象的屬性。常用的場景
定義setter和getter。 (在ES6中已經有了更好的定義方法)
定義對象屬性是否可枚舉enumerable。
可枚舉的屬性鍵值能夠被for in和Object.keys獲得。
最常見的例子就是，[]數(shù)組中索引屬性是可枚舉的，而標準成員方法就是不可枚舉的。
~! 這也是為什么我們不要使用for in遍歷數(shù)組的原因，因為可能有一些拙劣的上下文代碼，為數(shù)組添加了一個可枚舉的方法，因此我們在擴展一個特殊對象屬性時特別需要特別關注這一點
把對象的返回一個包括對象可枚舉鍵值的數(shù)組。
Object.keys和語句 for in 的功能十分相似，經常是一些細心的javascript開發(fā)者的討論熱點。回想那ES5還不完全兼容的年代， for in 承擔了遍歷對象鍵值的任務。
但是兩者實際上是不一樣的！
for in會遍歷對象原型鏈上所有的屬性，包括繼承下來的屬性，而 Object.keys 只會遍歷對象本身自己擁有的屬性，因此在一些場景下 Object.keys 更快，所以在很多場景下我們都應該優(yōu)先使用Object.keys 。
var a = {a1:1,a2:2,a3:3};
var b = {b1:1,b2:2,b3:3};
b.__proto__ = a;
for(var key in b) {
console.log(key); //b1,b2,b3,a1,a2,a3
}
Object.keys(b); //b1,b2,b3
參考：why-is-object-keys-faster-than-hasownproperty
而且由于該方法返回的是一個數(shù)組，因此我們也能很好的結合數(shù)組方法去處理對象中的數(shù)據
var obj = { a:"1", b:"2", c:"3" };
var values = Object.keys(obj).map(function(key){return obj[key]}); // 1,2,3
方法可以凍結一個對象。凍結對象是指那些不能添加新的屬性，不能修改已有屬性的值，不能刪除已有屬性，以及不能修改已有屬性的可枚舉性、可配置性、可寫性的對象。也就是說，這個對象永遠是不可變的。該方法返回被凍結的對象。
注意的是這個方法只會凍結被傳入的對象,而不會凍結對象key值所引用的對象。
var obj = {a: {b: "c" }};
Object.freeze(obj);
obj.a = 123; //不能成功賦值,但也不會報錯,只會靜默失敗
obj.a.b = "d"; //能成功賦值 => {a: {b: "d"}}
類似的方法還有Object.seal(obj)和Object.preventExtensions(obj)
Object.freeze引入不可變數(shù)據概念，但是由于實際開發(fā)中對性能的憂慮，實際很少被用到。
如果有場景需要避免對象使用者修改對象，Object.freeze將是一個很好的方法。而且由于數(shù)組[]也是一種對象，同樣也可以為通過該方法凍結數(shù)組。
Array對于數(shù)組標準API的擴展可以說是ES5.1中的重頭戲，這些核心API今天和未來都將為我們帶來便利和啟發(fā), 這里列舉和介紹一些常用的標準API。
Array.isArray() 方法用來判斷某個值是否為數(shù)組。如果是，則返回 true，否則返回 false。
javascript有六種原始數(shù)據類型primitive，包括undefined,object,function,boolean,number,string
其中object包括四種能通過語法糖構造的形態(tài){},null,/w+/(正則表達式),[](數(shù)組)
對于后三種特殊object，null可以使用xxx === null，正則表達式可以通過xxx instanceof RegExp判斷，而數(shù)組大多數(shù)時候似乎可以通過xxx instanceof Array判斷。
但是數(shù)組的情況仍然比較特殊,主要是數(shù)組在iframe中被傳遞時的場景,xxx instanceof Array會出現(xiàn)誤判。這種情況較為罕見，相關資料參考:
Difference between using Array.isArray and instanceof Array
Determining with absolute accuracy whether or not a JavaScript object is an array
盡管xxx instanceof Array和Array.isArray()大多數(shù)時候表現(xiàn)是一致的，但是我們仍然應該使用更加完備健壯的后者。
注意的是該方法并不能判斷一些很像數(shù)組的對象ArrayLike，例如querySelectorAll返回的ElementsList，通過ES6(ECMAScript 2015)引入的Array.from我們可以將其轉換成為標準數(shù)組
讓數(shù)組的每一項都執(zhí)行一次給定的函數(shù)，返回值為undefined
大多數(shù)時候該方法是語句for(var i=0;i
對于大規(guī)模的數(shù)組處理，forEach性能比for語句要慢很多，而且有沒有額外的產出，筆者覺得大多數(shù)時候比較雞肋。但是forEach仍然可能算是讀過的代碼中使用頻率較高的數(shù)組方法之一。
返回一個由原數(shù)組中的每個元素調用一個指定方法后的返回值組成的新數(shù)組。
map方法實際上是把一個數(shù)組映射成為另外一個數(shù)組
功能雖然簡單，和forEach很像，但因為能返回新的數(shù)組而變得十分實用（失之毫厘，差之千里）。
對于任何一個數(shù)組集合，都可以使用map進行映射操作，實現(xiàn)很豐富的功能，而且保證代碼的可讀性，該API也十分受開發(fā)者歡迎。
**
var arr = ["a","b","c"]
var arrToUpperCase = arr.map(function(ele,index){return ele.toUpperCase()});
// ["A","B","C"]
方法使用指定的函數(shù)測試所有元素，并返回一個包含所有通過測試的元素的新數(shù)組。
同樣也是十分實用的方法，有時候會看到不熟悉的小伙伴會使用for和新數(shù)組push實現(xiàn)類似的功能。
var alinks = docuement.querySelector("ul a");
var alinksValid = arrayFrom(alinks).filter(function(a){
return a.getAttribute("href")[0]!=="#"
})
function arrayFrom(arrayLike){
//... Array.from polyfill
}
/*
[
,
,
]
*/
方法測試數(shù)組中的某些元素是否通過了指定函數(shù)的測試，返回boolen值
非常實用的功能，判斷數(shù)組中是否某元素符合特定條件。如果傳入的方法校驗為true則余下的元素都不會繼續(xù)遍歷，不會有冗余的元素訪問。
var arr = [
{name:"xiaoA"}
,{name:"xiaoB"}
,{haha:">_<"}
,{name:"xiaoB"} //不會被訪問,已經跳出
]
arr.some(function(ele){return !!ele.haha}) // true
該方法有很多用途
數(shù)組元素進行一些靈活的校驗
選擇數(shù)組中第一個符合條件的元素
和for continue break組合相比，.some方法提供更好的可讀性和靈活性。
和some類似，但作用是檢查所有元素是否符合條件，與some互為補充。大多數(shù)場景下都可以用some實現(xiàn)相關的判斷，使用頻率不高。
方法接收一個函數(shù)作為累加器（accumulator），數(shù)組中的每個值（從左到右）開始合并，最終為一個值。
最靈活的方法，能夠實現(xiàn)非常豐富的功能。
reduce和reduceRight作用一樣，不同的是分別是從左右方向開始累加
reduce(fn,initialValue)方法第二個參數(shù)為初始值initialValue，會傳入累加方法的第一次調用時的第一個參數(shù)中，默認是數(shù)組的第一個元素
作為累加器，數(shù)值計算可以說是最普通的使用方法。
[1,2,3].reduce(function(a,b){return a+b}); // 1+2+3 => 6
[1,2,2,3,3,3].reduce(function(arr,curr){
if (arr.some(equal(curr))) return arr;
arr.push(curr);
return arr;
},[]); // [1,2,3]
function equal(value){
return function(target){return value===target}
}
var obj = { a:1, b:2, c:3 }
Object.keys(obj).reduce(function(_obj,key){
_obj[obj[key]] = key;
return _obj;
},{}) // {1:"a", 2:"b", 3:"c"}
...更多
map、filter和reduce都能返回一個數(shù)組,因此我們可以讓其通過鏈式組合成為數(shù)組加工的管道。
[...].map(fn).filter(fn).reduce(fn)JSON
兩個JSON方法都很常用了~
根據rfc4627標準解析JSON文本。
注意parse如果結果錯誤時會拋出異常，阻塞當次事件循環(huán)中接下來的代碼。所以通常需要進行try catch進行防御性校驗
function JSONparseSafe(str) {
try {
return JSON.parse(str);
} catch(e) {
console.warn(str,e);
}
return {};
}
補充：該方法有第二個參數(shù)
JSON.parse(text[, reviver])
reviver 可選 一個函數(shù)，用來轉換解析出的屬性值。
把對象序列化成為JSON格式字符串
很常用了~,和JSON.parse()一樣會拋出異常,筆者認為同樣需要進行try catch進行防御性校驗
注意該方法還有第二和第三個參數(shù)的
JSON.stringify(value[, replacer [, space]])
replacer
如果該參數(shù)是一個函數(shù)，則在序列化過程中，被序列化的值的每個屬性都會經過該函數(shù)的轉換和處理；如果該參數(shù)是一個數(shù)組，則只有包含在這個數(shù)組中的屬性名才會被序列化到最終的 JSON 字符串中。關于該參數(shù)更詳細的解釋和示例，請參考使用原生的 JSON 對象一文。
space
指定縮進用的空白字符串，用于美化輸出（pretty-print）。
var obj = { a:1, b:2 };
obj.self = obj;
// JSON.stringify(obj)
// Uncaught TypeError: Converting circular structure to JSON(…)
// 總所周知,JSON.stringify在序列化循環(huán)對象時會拋出異常
// 這時我們可以使用這樣來解決循環(huán)對象的問題
JSON.stringify(obj ,function(key,value){
if (key && value === obj) return "{[circular]}"
return value
}) //"{"a":1,"b":2,"self":"{[circular]}"}"
String
方法會刪除一個字符串兩端的空白字符。在這個字符串里的空格包括所有的空格字符
(" aa ").trim() //"aa"
方法雖然簡單,但是那些還用正則替換實現(xiàn)同樣的功能的同學好自為之吧<_<
DateDate.now
Date.prototype.toISOString
保留關鍵字雖然在ES5時代,ES6的具體標準特性還沒有定稿,但是已經定義一些"未來"會被使用的保留的關鍵字,在完全實現(xiàn)ES5標準的瀏覽器/JS引擎中關鍵字是不能作為字面量(literal)名的,否則將會報錯。這些關鍵字包括：
class
extend
super
enum
import
export
var class = "abc" // Uncaught SyntaxError: Unexpected token =
嗯，沒錯我們將（已經）在ES6中用上了他們。
兼容性與性能 影響雖然如今再談這些"老掉牙"的方法，在如今這個言必及ES6的時代略顯落伍，但是ES5作為javascript發(fā)展中的重要一環(huán)，我們仍然有必要去熟悉和了解他。
隨著Web的發(fā)展,前端開發(fā)者對javascript數(shù)據處理能力的訴求越來越強烈，以至于誕生了后來如jQuery、underscore等廣泛使用的工具庫。
而ECMAScript 5的到來也正是響應這一訴求，通過對js標準庫的擴展，極大的增強了js的處理數(shù)據的能力，尤其是面對js中[](數(shù)組)和{}(對象/哈希表)為核心的復合數(shù)據類型時。標準API抹平了不同工具庫對同一個功能的實現(xiàn)差異，同時也提高了代碼的可讀性。
ECMAScript 5的API設計也吸收了其他類型編程語言中實用思想，例如管道(pipeline)、無副作用(no side effects)、數(shù)據不可變(immumable)等概念，更后來引入的Stream(pipe(...).pipe(...))和Promise(then(...).then(...))也能看到這些影子。
還促進了實用工具庫的完善，例如后來的lodash 和 ramda等工具庫。
ES6也是朝著同樣的方向對js進行完善。
有了這些工具，開發(fā)者最終能從數(shù)據處理繁雜的邏輯中解放出來，去關注那些用戶關注的部分（界面、核心邏輯等）
兼容性http://kangax.github.io/compa...
作為javascript標準庫，ES5的特性已經被主流瀏覽器完全支持，包括桌面端、移動端和Node.js中都可以放心使用。
（即使你的客戶還在使用IE5、IE7、IE8，大多數(shù)也能使用es5-polyfill進行兼容）
對某些標準API帶來潛在性能損耗的猜疑確實使得相當多小伙伴望而卻步，但是我們仍然應該去了解這些標準的API，學習他們的設計思想，即便在一些性能要求較高的場景中，我們仍然能夠以標準作為參考，設計出優(yōu)雅的可讀性高的方法，而在大部分的場景中我認為應該合理去使用它們，享受標準完善帶來的紅利。
這樣能以一個更好地準備，擁抱未來更多的新特性。
相關鏈接JavaScript 標準庫 - MDN
Optimization-killers - bluebird (JavaScript性能優(yōu)化技巧)
Composers and audiences (譯文)
Enjoy!~ 當我們?yōu)?b>ES6的特性感到興奮的同時, 我們已經知曉如何應用ES5了嗎?
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/49959.html
摘要：返回一個由原數(shù)組中的每個元素調用一個指定方法后的返回值組成的新數(shù)組。方法測試數(shù)組中的某些元素是否通過了指定函數(shù)的測試，返回值非常實用的功能，判斷數(shù)組中是否某元素符合特定條件。 ECMAScript 5發(fā)布于2009年12月。ECMAscript 5.1版(下文稱ES5)發(fā)布于2011年6月，，并且成為ISO國際標準（ISO/IEC 16262:2011） http://www.ecma...
摘要：除和外，所有的數(shù)據類型都是可以轉化為對象，而如果是對象，就肯定有構造函數(shù)。特性因為和沒有構造函數(shù)，因此不能用此方法來判斷。由于同一條原型繼承鏈上的各個對象的構造函數(shù)都不一樣，因此，此方法可以區(qū)分開繼承鏈上的各個自定義數(shù)據類型。 typeof 用法示例 var arr = []; typeof arr; //object typeof(arr); //object typeo...
摘要：更新了個版本，最新正式版是語言的下一代標準，早已在年月正式發(fā)布。基本不支持移動端瀏覽器對的支持情況版起便可以支持的新特性。比較通用的工具方案有，，，等。 1、ECMAScript是什么？ 和 JavaScript 有著怎樣的關系？ 1996 年 11 月，Netscape 創(chuàng)造了javascript并將其提交給了標準化組織 ECMA，次年，ECMA 發(fā)布 262 號標準文件（ECMA-...
摘要：瀏覽器兼容性列表可以看到還是全線飄紅的和支持特新列表據此在和上使用這些新特新待補充二相關教程最重要的產品規(guī)格書，什么教程也脫離不了這里的標準，英文好的還是多看點。 一. ES6新特性相關 es6features : 經典的ES6新特性預覽，github 逼近 10k star . ES6新特性概覽 ：同樣也很全面的特性介紹的中文版。 瀏覽器兼容性列表 ：可以看到還是全線飄紅的~~~ ...
閱讀 2571·2021-11-22 09:34
閱讀 932·2021-11-19 11:34
閱讀 2801·2021-10-14 09:42
閱讀 1472·2021-09-22 15:27
閱讀 2385·2021-09-07 09:59
閱讀 1731·2021-08-27 13:13
閱讀 3432·2019-08-30 11:21
閱讀 771·2019-08-29 18:35
