深入JavaScript高級(jí)程序設(shè)計(jì)之對(duì)象、數(shù)組(棧方法,隊(duì)列方法,重排序方法,迭代方法)
繼承是OO語(yǔ)言中的一個(gè)最為人津津樂(lè)道的概念。 許多OO語(yǔ)言都支持兩種繼承方式:接口繼承和實(shí)現(xiàn)繼承。 接口繼承只繼承方法簽名,而實(shí)現(xiàn)繼承則繼承實(shí)際的方法。 如其所述,由于函數(shù)沒(méi)有簽名,在ECMAScript中無(wú)法實(shí)現(xiàn)接口繼承。 ECMAScript只支持實(shí)現(xiàn)繼承,而且其實(shí)現(xiàn)繼承主要是依靠原型鏈來(lái)實(shí)現(xiàn)的。
1.使用對(duì)象字面量定義對(duì)象
var person={};
使用這種方式創(chuàng)建對(duì)象時(shí),實(shí)際上不會(huì)調(diào)用Object構(gòu)造函數(shù)。
開發(fā)人員更喜歡對(duì)象字面量的語(yǔ)法。
2.有時(shí)候需要傳遞大量可選參數(shù)的情形時(shí),一般來(lái)講使用對(duì)象字面量來(lái)封裝多個(gè)可選參數(shù)。
3.對(duì)象屬性的點(diǎn)表示法與方括號(hào)表示法的區(qū)別
(1)功能上:兩者沒(méi)區(qū)別
(2)但是方括號(hào)的有點(diǎn)是可以通過(guò)變量來(lái)訪問(wèn)屬性
例如:
var person={ name:"Nic" }
點(diǎn)表示法:person.name
方括號(hào)表示法:var prop=“name”;
person[prop]
(3)還有一個(gè)優(yōu)點(diǎn)是:
如果屬性名中包含會(huì)導(dǎo)致語(yǔ)法錯(cuò)誤的字符或者關(guān)鍵字,保留字時(shí)候,使用方括號(hào)不會(huì)錯(cuò)
例如:person["first name"]="OK";
(4)通常,建議使用點(diǎn)表示法
4.創(chuàng)建數(shù)組的問(wèn)題
var colors=[1,2,] //不要這樣。這樣會(huì)創(chuàng)建一個(gè)包含2個(gè)或3個(gè)項(xiàng)的數(shù)組
var opy=[,,,,,] //不要這樣。這樣會(huì)創(chuàng)建一個(gè)包含5個(gè)或6個(gè)項(xiàng)的數(shù)組
這是因?yàn)镮E8及之前的版本在實(shí)現(xiàn)數(shù)組字面量方面有bug
使用字面量創(chuàng)建數(shù)組時(shí),不會(huì)調(diào)用Array構(gòu)造函數(shù)
5.如果設(shè)置某個(gè)值的索引超過(guò)了數(shù)組現(xiàn)有項(xiàng)數(shù)。
如:var color=[1,2,3]
color[3]時(shí),數(shù)組會(huì)自動(dòng)增加到該索引值加1的長(zhǎng)度
這時(shí),color[3]的值就是undefined
6.數(shù)組的length不只是只讀的。通過(guò)設(shè)置length該屬性,可以不斷向數(shù)組末尾添加新項(xiàng)。
7.數(shù)組轉(zhuǎn)換成字符串 toString() join()
array.toString() //返回以逗號(hào)分隔的字符串 array.valueOf() //返回的還是數(shù)組 array.join(",") //也可以
8.數(shù)組的棧方法 push() pop()
棧是一種數(shù)據(jù)結(jié)構(gòu),也就是最新添加的項(xiàng)最早被移除(后進(jìn)先出)。而棧中項(xiàng)的插入和移除,只發(fā)生在一個(gè)位置--棧的頂部。
ECMAScript提供了push()與pop()方法來(lái)實(shí)現(xiàn)這種棧。
push() 方法可向數(shù)組的末尾添加一個(gè)或多個(gè)元素,并返回新的長(zhǎng)度。
pop() 方法用于刪除并返回?cái)?shù)組的最后一個(gè)元素。
例子:
var arr=[]; var count=arr.push('a','b'); //count=2 arr.push('c'); var item=arr.pop(); //移除最后一項(xiàng) c item=c 并且改變數(shù)組長(zhǎng)度
9.隊(duì)列方法 shift() unshift()
隊(duì)列數(shù)據(jù)的訪問(wèn)規(guī)則是先進(jìn)先出
ECMAScript提供了shift()來(lái)實(shí)現(xiàn)。
shift() 方法用于把數(shù)組的第一個(gè)元素從其中刪除,并返回第一個(gè)元素的值。
unshift() 方法可向數(shù)組的開頭添加一個(gè)或更多元素,并返回新的長(zhǎng)度。
10.重排序方法 sort() reverse()
ECMAScript提供了sort()與reverse()來(lái)實(shí)現(xiàn)。
sort()會(huì)調(diào)用每個(gè)數(shù)組項(xiàng)的tostring()方法,比較得到的字符串來(lái)排序。
11.數(shù)組的拼接 concat()
concat() 方法用于連接兩個(gè)或多個(gè)數(shù)組。
該方法不會(huì)改變現(xiàn)有的數(shù)組,而僅僅會(huì)返回被連接數(shù)組的一個(gè)副本。
12.slice() 方法可從已有的數(shù)組中返回選定的元素。
13.位置方法:indexOf()與lastIndexOf()
14.迭代方法
ECMAScript5定義了下列5種方法,該5種方法都接收三個(gè)參數(shù):數(shù)組項(xiàng)的值,該項(xiàng)在數(shù)組中的位置,數(shù)組對(duì)本身
every(),filter(),forEach(),map(),some()
例子:
var num=[1,2,3,4]; var res=num.every(function(item,index,array){ return (item>2) }) //false 必須每一項(xiàng)都大于2,才返回true var res=num.some(function(item,index,array){ return (item>2) }) //true 只要有一個(gè)大于2,就返回true var res=num.filter(function(item,index,array){ return (item>2) }) //[3,4] var res=num.forEach(function(item,index,array){ return (item>2) }) //[1,4,9,16]
javascript 數(shù)組對(duì)象中的迭代方法
/* javascript 數(shù)組對(duì)象中的迭代方法 * ECMAScript5為數(shù)組定義了5個(gè)迭代方法。每個(gè)方法都接受兩個(gè)參數(shù),第一個(gè)是進(jìn)行迭代的函數(shù),第二個(gè)是該函數(shù)的作用域?qū)ο蟆究蛇x】。 * 進(jìn)行迭代的函數(shù)接受三個(gè)參數(shù),第一個(gè)是數(shù)組中要進(jìn)行迭代的元素的值,第二個(gè)是數(shù)組候總要進(jìn)行迭代的元素的位置,第三個(gè)是迭代數(shù)組本身。 * 1. every() 對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定的函數(shù),如果該函數(shù)對(duì)每一項(xiàng)都返回true,則返回true * 2. filter() 對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定的函數(shù),返回該函數(shù)返回true的項(xiàng)組成的數(shù)組。 * 3. forEach() 對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定的函數(shù),這個(gè)方法沒(méi)有返回值 * 4. map() 對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定的函數(shù),返回每次函數(shù)調(diào)用的結(jié)果組成的數(shù)組 * 5. some() 對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定的函數(shù),如果該函數(shù)對(duì)任意一項(xiàng)返回true,則返回true * * 這些迭代方法支持的瀏覽器有,IE9+,F(xiàn)irefox2+,Safari3+,Opera 9.5+,chrome */ var num = [1,2,3,4,5,6,7,8,9]; var everyResult = num.every(function(item, index, array) { if(item > 2) { return true; } }); alert(everyResult); var someResult = num.some(function(item) { if(item > 2) { return true; } }); alert(someResult); var filterResult = num.filter(function(item) { if(item > 2) { return true; } }); alert(filterResult); var mapResult = num.map(function(item) { if(item > 2) { return true; } }); alert(mapResult); var forEachResult = num.forEach(function(item) { if(item > 2) { return true; } }); alert(forEachResult);
- JavaScript數(shù)據(jù)結(jié)構(gòu)與算法之棧與隊(duì)列
- JS實(shí)現(xiàn)隊(duì)列與堆棧的方法
- JavaScript數(shù)組實(shí)現(xiàn)數(shù)據(jù)結(jié)構(gòu)中的隊(duì)列與堆棧
- JavaScript數(shù)組的棧方法與隊(duì)列方法詳解
- JavaScript數(shù)據(jù)結(jié)構(gòu)學(xué)習(xí)之?dāng)?shù)組、棧與隊(duì)列
- JS實(shí)現(xiàn)利用兩個(gè)隊(duì)列表示一個(gè)棧的方法
- JavaScript棧和隊(duì)列相關(guān)操作與實(shí)現(xiàn)方法詳解
- JavaScript基于數(shù)組實(shí)現(xiàn)的棧與隊(duì)列操作示例
- 如何使用JavaScript實(shí)現(xiàn)棧與隊(duì)列
- JavaScript中棧和隊(duì)列應(yīng)用詳情
相關(guān)文章
js 計(jì)數(shù)排序的實(shí)現(xiàn)示例(升級(jí)版)
這篇文章主要介紹了js 計(jì)數(shù)排序的實(shí)現(xiàn)示例(升級(jí)版),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-01-01javascript動(dòng)態(tài)獲取登錄時(shí)間和在線時(shí)長(zhǎng)
這篇文章主要為大家詳細(xì)介紹了javascript動(dòng)態(tài)獲取登錄時(shí)間和在線時(shí)長(zhǎng)的相關(guān)資料,獲得登錄時(shí)候的時(shí)間,用來(lái)和動(dòng)態(tài)的時(shí)間做差來(lái)求時(shí)長(zhǎng),感興趣的小伙伴們可以參考一下2016-02-02輕松實(shí)現(xiàn)js彈框顯示選項(xiàng)
這篇文章主要為大家詳細(xì)介紹了js輕松實(shí)現(xiàn)彈框顯示選項(xiàng)效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-09-09JavaScript與ActionScript3兩者的同性與差異性
接觸JavaScript和ActionScript3也有近5年的時(shí)間了,它們都是應(yīng)用比較廣泛的腳本語(yǔ)言.接下來(lái)通過(guò)本文給大家介紹JavaScript與ActionScript3兩者的同性與差異性,感興趣的朋友一起學(xué)習(xí)吧2016-09-09解決AjaxFileupload 上傳時(shí)會(huì)出現(xiàn)連接重置的問(wèn)題
這篇文章主要介紹了解決AjaxFileupload 上傳時(shí)會(huì)出現(xiàn)連接重置的問(wèn)題,需要的朋友可以參考下2017-07-07封裝了一個(gè)自動(dòng)生成漸變字的JS類(clip)
之前做過(guò)一個(gè)生成漸變字體的簡(jiǎn)單演示今天閑著沒(méi)事就把這個(gè)功能完善了,把JS代碼封裝成一個(gè)類,載入頁(yè)面就可以使相應(yīng)的HTML元素內(nèi)部的字體產(chǎn)生漸變色。2008-11-11