Javascript數(shù)組Array基礎(chǔ)介紹
Javascript,一門(mén)神奇的語(yǔ)言,它的數(shù)組也同樣獨(dú)特。我們要去其糟粕,取其精華,把常用的最優(yōu)實(shí)踐總結(jié)出來(lái)。如有錯(cuò)誤,請(qǐng)指出。
javascript數(shù)組是一種類(lèi)數(shù)組的對(duì)象,擁有對(duì)象的特性。當(dāng)屬性名是小而連續(xù)的整數(shù)時(shí),應(yīng)該使用數(shù)組,否則,使用對(duì)象。
數(shù)組來(lái)源
所有的數(shù)組都是Array構(gòu)造出來(lái)的,我們來(lái)測(cè)試一下constructor這個(gè)屬性。
var arr = []; arr.constructor === Array; // true arr.constructor === Array.prototype.constructor; // true
創(chuàng)建數(shù)組
//數(shù)組字面量方式 var arr1 = [1, 2, 3]; // [1,2,3] //構(gòu)造函數(shù)方式 var arr2 = new Array(); // [] 空數(shù)組 var arr3 = new Array('9'); // ["9"] 一個(gè)字符串元素 var arr4 = new Array(9); // [] 數(shù)組長(zhǎng)度length為9 var arr5 = new Array([9]); // [[9]] 相當(dāng)于二維數(shù)組 var arr6 = new Array(1, 2, 3); // [1, 2, 3] var arr7 = new Array(1, function f(){}, {o : 6}, null,undefined,true); // 數(shù)組可以存儲(chǔ)任意混合數(shù)據(jù)類(lèi)型
由于arr4的方式,當(dāng)只有一個(gè)數(shù)字參數(shù)傳遞到Array的構(gòu)造函數(shù)中,構(gòu)造函數(shù)會(huì)返回設(shè)置了length屬性的空數(shù)組。所以推薦使用數(shù)組字面量方式,短小而簡(jiǎn)潔。
檢測(cè)對(duì)象是否為數(shù)組
var arr1 = [1, 2, 3]; typeof(arr1); // object
眾所周知,typeof不能正確檢測(cè)類(lèi)型。
arr1 instanceof Array; //true
instanceof 方式在一個(gè)網(wǎng)頁(yè)內(nèi)是沒(méi)有問(wèn)題,一旦嵌套其他網(wǎng)頁(yè),便存在兩個(gè)全局作用域,互相調(diào)用時(shí)的檢測(cè)就會(huì)出問(wèn)題。
Array.isArray(arr1); // true
Array.isArray() 是ECMAScript5 新增的方法,沒(méi)有缺陷。唯一的問(wèn)題是ie8瀏覽器不支持,ie9瀏覽器在嚴(yán)格模式下也不支持。
Object.prototype.toString.apply(arr1).slice(8, -1); // Array
最后一種方式是檢測(cè)類(lèi)型的最好方法。
數(shù)組長(zhǎng)度
數(shù)組的length也是它的屬性,增大length也不會(huì)發(fā)生越界錯(cuò)誤。
length值等于數(shù)組最大的整數(shù)屬性名加1。
var arr1 = []; arr1[9] = 1; // 長(zhǎng)度為10,只包含一個(gè)元素的數(shù)組
設(shè)小值將將會(huì)把屬性名大于等于length的屬性刪除。
如果將length值設(shè)為0,相當(dāng)于清空數(shù)組。
var arr2 = [1, 2, 3, 4, 5]; arr2.length = 3; // [1, 2, 3] arr2.length = 0; // []
數(shù)組遍歷
遍歷數(shù)組不要使用for in循環(huán)遍歷數(shù)組,因?yàn)閒or in會(huì)遍歷原型鏈上的所有屬性,但我們并不需要這么多。推薦使用for循環(huán)的方式。
var arr1 = [1, 2, 3]; arr1.test = 9; //for in 方式 for(var prop in arr1){ cosole.log(prop, arr1[prop]); } // 輸出如下 // 0 1 // 1 2 // 2 3 // test 9 //for循環(huán)方式 for(var i = 0, len = arr1.length; i < len; i++){ console.log(arr1[i]); } //輸出如下 // 1 // 2 // 3
我們看到for in方式多出了一個(gè)test值,可以使用hasOwnProperty函數(shù)排除,但那會(huì)比f(wàn)or循環(huán)的方式慢很多。
緩存數(shù)組長(zhǎng)度很有必要的一步,每次訪(fǎng)問(wèn)是有性能開(kāi)銷(xiāo)的(最新的瀏覽器在這方面做了優(yōu)化)。
小結(jié)
簡(jiǎn)單介紹了Array的相關(guān)基礎(chǔ)知識(shí),到這里也算是能對(duì)Array有更全面的理解了。下一篇介紹Array的方法。
Javascript雖然有很多不太容易弄懂的地方,隨著長(zhǎng)時(shí)間的學(xué)習(xí),我已經(jīng)慢慢地愛(ài)上它了(因?yàn)楝F(xiàn)在沒(méi)有妹子讓我愛(ài))。
相關(guān)文章
JavaScript中使用自然對(duì)數(shù)ln的方法
這篇文章主要介紹了JavaScript中使用自然對(duì)數(shù)ln的方法,是JS入門(mén)學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下2015-06-06javascript實(shí)現(xiàn)playfair和hill密碼算法
這篇文章主要介紹了javascript實(shí)現(xiàn)playfair和hill密碼算法,需要的朋友可以參考下2014-12-12JavaScript與DOM組合動(dòng)態(tài)創(chuàng)建表格實(shí)例
這篇文章簡(jiǎn)單介紹了DOM 1.0一些基本而強(qiáng)大的方法以及如何在JavaScript中使用它們;你可以學(xué)到如何動(dòng)態(tài)地創(chuàng)建、獲取、控制和刪除HTML元素2012-12-12Javascript實(shí)例教程(19) 使用HoTMetal(7)
Javascript實(shí)例教程(19) 使用HoTMetal(7)...2006-12-12javascript 構(gòu)造函數(shù)方式定義對(duì)象
這篇文章主要介紹了javascript 構(gòu)造函數(shù)方式定義對(duì)象的方法及示例,需要的朋友可以參考下2015-01-01MVC+Layui彈出表單模態(tài)框的實(shí)現(xiàn)代碼
這篇文章主要介紹了MVC+Layui彈出表單模態(tài)框的實(shí)現(xiàn)代碼,本文結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2024-01-01