es5新特性總結

參考: ECMAScript5.1及其新增API簡介

ECMAScript 5.1就是我們常說的es5。它在2012年就已經被公開。時至今日,除了一些較低版本的瀏覽器,各大主流瀏覽器都已經實現支持了es5的絕大部分特性。

關于對象實例的屬性,每一個實例都有兩種屬性,

function Person(name){
  this.name = name
}
var p1 = new Person("ss")
p1.age = 18;

一種是實例屬性(age 和 name其實是一樣的,只是不同時間綁定的。都是直接綁定到這個對象上的,而不需要是去找它的原型proto),一種是原型屬性(即它的構造函數的prototype上的屬性)
obj.hasOwnProperty(prop)(老版本):方法用來判斷某個對象是否含有指定的自身(實例)屬性。
in 判斷對象是否有這個屬性,無論是在實例還是原型中(for in 一樣)。判斷某對象是否有某個原型屬性:

function hasPrototypeProperty(o, name){
  return !o.hasOwnProperty(name) && (name in o)
}
console.log(hasPrototypeProperty(p1, "sayName"))

(ES5中又提供了兩個方法,Object.keys:返回可枚舉(能通過for in 返回)實例屬性數組,還有Object.getOwnPropertyNames 返回一個數組,包括對象所有自有(實例)屬性名稱集合(包括不可枚舉的屬性))

test:

function Person(){
  this.age = 18;
}
Person.prototype.name="s";
var p1 = new Person();
for(var i in p1){
   console.log(i)//age,name
}
console.log(p1.hasOwnProperty("age"));//實例屬性
console.log(p1);//打印{age: 18, __proto__:{name:"s"}}
console.log(p1.name);//可以打印值
console.log(Object.keys(p1));//只有age(實例),可枚舉的(是否可枚舉是可以設置的)
console.log(Object.getOwnPropertyNames(p1))//只有age(實例),包括不可枚舉的

新增Object接口

  • 對象 構造器 說明
  • Object getPrototypeOf 返回對象的原型
  • Object getOwnPropertyDescriptor 返回對象自有屬性的屬性描述符
  • Object getOwnPropertyNames 返回一個數組,包括對象所有自有屬性名稱集合(包括不可枚舉的屬性)
  • Object create 創建一個擁有置頂原型和若干個指定屬性的對象
  • Object defineProperty 給對象定義一個新屬性,或者修改已有的屬性,并返回
  • Object defineProperties 在一個對象上添加或修改一個或者多個自有屬性,并返回該對象
  • Object seal 鎖定對象。阻止修改現有屬性的特性,并阻止添加新屬性。但是可以修改已有屬性的值。
  • Object freeze 凍結對象,阻止對對象的一切操作。凍結對象將永遠不可變。
  • Object preventExtensions 讓一個對象變的不可擴展,也就是永遠不能再添加新的屬性。
  • Object isSealed 判斷對象是否被鎖定
  • Object isFrozen 判斷對象是否被凍結
  • Object isExtensible 判斷對象是否可以被擴展
  • Object keys 返回一個由給定對象的所有可枚舉自身屬性的屬性名組成的數組

這里不打算對每個新增接口作詳細描述,不過比較常用的有如下幾個,

  • Object.create
Object.create = function(o) {
  var F = function() {};
  F.prototype = o;
  return new F();
};
  • Object.defineProperties
  • Object.keys

新增Array接口

  • 對象 構造器 說明
  • Array.prototype indexOf 返回根據給定元素找到的第一個索引值,否則返回-1
  • Array.prototype lastIndexOf 方法返回指定元素在數組中的最后一個的索引,如果不存在則返回 -1
  • Array.prototype every 測試數組的所有元素是否都通過了指定函數的測試-檢測數組中的所有元素是否都大于 10,返回true or false
  • Array.prototype some 測試數組中的某些元素是否通過了指定函數的測試-檢測在數組中是否有元素大于 10,返回true or false
  • Array.prototype forEach 讓數組的每一項都執行一次給定的函數-循環-返回 undefined(forEach無法使用break,continue跳出循環,使用return時,效果和在for循環中使用continue一致)

$.each(demoArr|demoObj, function(e, ele))

使用return或者return true
為跳過一次循環,繼續執行后面的循環
使用return false
為終止循環的執行,但是并不終止函數執行

無法使用break與continue來跳過循環

  • Array.prototype map 返回一個由原數組中的每個元素調用一個指定方法后的返回值組成的新數組-求數組中每個元素的平方根
  • Array.prototype filter 利用所有通過指定函數測試的元素創建一個新的數組,并返回-創建了一個新數組,該數組的元素由原數組中值大于 10 的元素組成。
  • Array.prototype reduce 接收一個函數作為累加器,數組中的每個值(從左到右)開始縮減,最終為一個值
  • Array.prototype reduceRight 接受一個函數作為累加器,讓每個值(從右到左,亦即從尾到頭)縮減為一個值
    新增的數組接口中,基本都是比較有用的接口。需要注意的一點是,有的數組方法是不返回新數組的,有的接口是返回一個新數組,就是說使用這些新接口時,需要注意一下方法的返回值。

另外Array還有一個新增的接口,Array.isArray。顯然此新增接口并不是實例方案,而是類似“靜態方法”一樣的存在。其作用很簡單,就是判斷某一對象是否為數組。

新增Function接口

Function.prototype.bind
bind()方法會創建一個新函數,稱為綁定函數.當調用這個綁定函數時,綁定函數會以創建它時傳入 bind()方法的第一個參數作為 this,傳入 bind() 方法的第二個以及以后的參數加上綁定函數運行時本身的參數按照順序作為原函數的參數來調用原函數。

Strict Mode

**Strict Mode **, 即所謂的嚴格模式。嚴格模式的意義是為了提供一種更佳良好錯誤檢查機制,讓你規避掉一些語言本身的bad point。
比如在嚴格模式下,我們不可以使用一個未經聲明的變量。

JSON對象

ES5提供一個內置的(全局)JSON對象,可用來序列化( JSON.stringfy )和反序列化( parse )對象為JSON格式。
用法及第二個參數的用法:

var test = {
   "name": "gejiawen",
   "age": 22
};
console.log(JSON.strinfy(test)); // '{"name": "gejiawen", "age": 22}'
console.log(JSON.parse('{"name": "larry"}')); // Object {name: "larry"}

JSON.parse('{"name": "gejiawen", "age": 22, "lucky": "13"}', function(key, value) {
   return typeof value === 'string' ? parseInt(value) : value;
});

var o = {
   name: 'gejiawen',
   age: 22,
   lucky: '13'    
};
var ret = JSON.stringify(o, function(key, value) {
   return typeof value === 'string' ? undefined : value;
}, 4);
console.log(ret);
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,825評論 6 546
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,814評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,980評論 0 384
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 64,064評論 1 319
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,779評論 6 414
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 56,109評論 1 330
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 44,099評論 3 450
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 43,287評論 0 291
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,799評論 1 338
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,515評論 3 361
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,750評論 1 375
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,221評論 5 365
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,933評論 3 351
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,327評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,667評論 1 296
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,492評論 3 400
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,703評論 2 380

推薦閱讀更多精彩內容