摘要:創(chuàng)建數(shù)組字面量語(yǔ)法數(shù)組直接量或構(gòu)造函數(shù)需要注意的是數(shù)組直接量的語(yǔ)法允許有可選的結(jié)尾的逗號(hào),所以只有兩個(gè)元素而非三個(gè)數(shù)組元素的讀和寫(xiě)需要注意的是如果是負(fù)數(shù)或非負(fù)來(lái)索引數(shù)組,數(shù)組將轉(zhuǎn)換為字符串,字符串作為屬性名來(lái)用。
1 創(chuàng)建數(shù)組
字面量語(yǔ)法(數(shù)組直接量)或構(gòu)造函數(shù)
需要注意的是數(shù)組直接量的語(yǔ)法允許有可選的結(jié)尾的逗號(hào),所以[,,]只有兩個(gè)元素而非三個(gè)
2 數(shù)組元素的讀和寫(xiě)需要注意的是如果是負(fù)數(shù)或非負(fù)來(lái)索引數(shù)組,數(shù)組將轉(zhuǎn)換為字符串,字符串作為屬性名來(lái)用。
var arr = []; arr[-12] = 10; console.log(arr[-12]); //此時(shí)這是一個(gè)屬性
數(shù)組也是對(duì)象,所以也可以定義getter和setter方法
var arr = []; Object.defineProperties(arr, { name: { value: "Oliver", writable: true }, getName: { set: function(value) { this.name = value; }, get: function() { return this.name; } } }) arr.getName = "Oli"; //寫(xiě)入數(shù)據(jù) console.log(arr.getName); //讀取數(shù)據(jù)3 稀疏數(shù)組
定義稀疏數(shù)組:
var arr0 = [,,,]; // 稀疏 var arr1 = [1,,2,]; // 稀疏 var arr2 = new Array(3); // 稀疏 var arr3 = new Array(); arr3.length = 3; // 稀疏 var arr4 = [1,2,3]; delete arr4[0]; // 稀疏 // 以下都是非稀疏 var arr5 = [undefined, undefined, undefined]; var arr6 = new Array(3); arr6[0] = undefined; arr6[1] = undefined; arr6[2] = undefined;
需要注意的是當(dāng)在數(shù)組直擊量中省略值時(shí)不回創(chuàng)建稀疏數(shù)組。省略的元素在數(shù)組中是存在的,值是undefined,可以用in操作符檢測(cè)
判斷是否是稀疏數(shù)組:
index in array
forEach
如:下面哪些是稀疏數(shù)組
4 數(shù)組長(zhǎng)度length屬性
另外可以用Object.defineProperty()讓數(shù)組的length屬性變?yōu)橹蛔x:
var arr = [,,,]; Object.defineProperty(arr, "length", { writable: false }) arr.length = 10; //嚴(yán)格模式下報(bào)錯(cuò)
也可以用preventExtensible、seal、freeze來(lái)設(shè)置權(quán)限;
var arr = [,,,]; Object.preventExtensions(arr); console.log(arr.length); //3 arr.push("hello"); //嚴(yán)格模式下報(bào)錯(cuò)5 數(shù)組元素的添加和刪除
pop方法
push方法
shift方法
unshift方法
splice方法
delete方法
需要注意的是delete操作不會(huì)影響數(shù)組的長(zhǎng)度
var arr = [1,2,3,4]; delete arr[2]; console.log(arr.toString()); //1,2,,4 變成了稀疏數(shù)組6 數(shù)組遍歷
使用for循環(huán)是遍歷數(shù)組元素最常見(jiàn)的方法:
// let o = { // name: "Oliver", // age: 18 // }; let o = ["Oliver", 18]; var keys = Object.keys(o); //屬性名數(shù)組 var values = []; for (var i = 0; i < keys.length; i++) { var key = keys[i]; values[i] = o[key]; }; console.log(keys.toString()); //屬性名 console.log(values.toString()); //值
或for-in循環(huán):
for (let key in arr) { console.log(arr[key]); } // for (let key in arr) { // if (!arr[key]) { // continue; // } // console.log(arr[key]); // }
for-in循環(huán)會(huì)枚舉到繼承的屬性,需要過(guò)濾:
for (let key in arr) { if (!arr.hasOwnProperty(key)) { continue; } console.log(arr[key]); }
最好不要用forin循環(huán),遍歷可能是升序也可能不是。
ES5中規(guī)定了新的方法forEach():
let arr = ["Oliver",,null,,,,undefined, 18]; arr.forEach( function(element, index) { console.log(element); console.log(index); }); //Oliver //0 //null //2 //undefined //6 //18 //77 多維數(shù)組
所謂的多維數(shù)組在JS中就是數(shù)組的數(shù)組;
8 ES3數(shù)組方法 8.1 join()和字符串方法split()let arr = ["Oliver",,null,,,,undefined, 18]; console.log(arr.length); //8 var result = arr.join(" "); console.log(result); //Oliver 18 console.log(result.split(" ").length); //8 console.log(result.split(" ").toString()); //Oliver,,,,,,,188.2 reverse() 8.3 sort()以及比較函數(shù)的參數(shù)
let arr = [213, 23, 2123, 1, 4, "Oliver", "Alice", "ali", "oli"]; console.log(arr.sort().toString()); //1,2123,213,23,4 console.log(arr.sort(compare).toString()); //1,2123,213,23,4,ali,Alice,oli,Oliver function compare(a, b) { var a = a.toString().toLowerCase(); var b = b.toString().toLowerCase(); if (a > b) { //從小到大 return 1; } else if (a = b) { return 0; } else { return -1; } }8.4 返回新數(shù)組 concat() 接收可選的多個(gè)參數(shù) 不改變?cè)瓉?lái)的數(shù)組 8.5 返回子數(shù)組 slice() 接收可選的一個(gè)或兩個(gè)參數(shù) 不改變?cè)瓉?lái)的數(shù)組 8.6 插入和刪除數(shù)組 splice() 接收可選的一個(gè)起始位置、刪除的個(gè)數(shù)以及任意的要插入的元素
let arr = [213, 23,1,3,4,43]; var a = arr.splice(1,0,"hello"); console.log(arr.toString()); //213,hello,23,1,3,4,43 console.log(a.toString()); //空 沒(méi)有元素被刪除8.7push()和pop(),unshift()和shift() 8.8 toString()和toLocaleString() 9 ES5數(shù)組方法 9.1 forEach()
接收一個(gè)函數(shù),該函數(shù)可以有三個(gè)參數(shù):
數(shù)組元素
元素的索引
數(shù)組本身
語(yǔ)法:
array.forEach( function(element, index, array) { // statements });
let arr = [1,2,3,4,5]; arr.forEach( function(element, index, array) { switch (arr[index]) { case 1: array[index] = element + "st"; break; case 2: array[index] = element + "nd"; break; case 3: array[index] = element + "rd"; break; default: array[index] = element + "th"; break; } }); console.log(arr.toString()); //1st,2nd,3rd,4th,5th9.2 map()
該方法將調(diào)用的數(shù)組的每個(gè)元素傳遞給指定的函數(shù),并返回一個(gè)數(shù)組,包含該函數(shù)的返回值,也就是說(shuō),傳遞給map方法的函數(shù)必須有返回值。map方法返回的是新的數(shù)組
語(yǔ)法:
var newArray = array.map(function (item) { // body... })
let arr = [1,2,3,4,5]; let newArray = arr.map(function (item) { var index = arr.indexOf(item); if (arr[index + 1]) { return item + arr[index + 1] } }); console.log(newArray.join(";"));9.3 filter()
該方法接收的函數(shù)是用來(lái)邏輯判定的,如果為真,則將該子集的成員添加到一個(gè)作為返回值中的數(shù)組中;
語(yǔ)法:
var newArray = array.filter(function (x) { // body... });
var arr = [1, 2, 3, 4, 5, 6]; var smaller = arr.filter(function(x) { if (x < 4) return true; }); console.log(smaller.toString()); //1,2,3 var doubles = arr.filter(function(a, b) { if ((a + b) === 5) { return true } }); console.log(doubles.toString()); //3
filter方法會(huì)跳過(guò)稀疏數(shù)組中缺少的元素,返回的數(shù)組是稠密的,可以用來(lái)壓縮稀疏數(shù)組
var arr = [1, , undefined, , null, 6]; var anotherA = arr.filter(function(item) { return true; }); console.log(anotherA.toString()); //1,,,6
也可以壓縮空缺并刪除undefined和null元素
var arr = [1, , undefined, , null, 6]; var anotherA = arr.filter(function(item) { return item !== undefined && item !== null; }); console.log(anotherA.toString()); //1,69.4 every()和some()
every方法,當(dāng)且僅當(dāng)數(shù)組中的成員在判定函數(shù)中都返回true,才返回true;
some方法,至少有一個(gè)數(shù)組中的成員在判定函數(shù)中返回true,就返回true;
9.5 reduce()和reduceRight()reduce方法
將數(shù)組進(jìn)行組合,生成單個(gè)值,第二個(gè)參數(shù)為初始值(如果沒(méi)有指定初始值,那么使用數(shù)組的第一個(gè)元素作為其初始值)
語(yǔ)法:
var result = array.reduce(function(previous, current, index, array) { //body... }, initialValue);
var arr = [1,2,3,4,5,6]; var result = arr.reduce(function (x,y) { return x + y; }, 0); console.log(result); //21
實(shí)際運(yùn)用(多維數(shù)組的扁平化):
var matrix = [ [1, 2], [3, 4], [5, 6, 7], [8, 9, 10, 11] ]; var result = matrix.reduce(function(previous, current, index, array) { return previous.concat(current); }); console.log(result.toString()); //1,2,3,4,5,6,7,8,9,10,11
reduceRight方法(從右到左的順序)
var matrix = [ [1, 2], [3, 4], [5, 6, 7], [8, 9, 10, 11] ]; var result = matrix.reduceRight(function(previous, current, index, array) { return previous.concat(current); }); console.log(result.toString()); //8,9,10,11,5,6,7,3,4,1,29.6 indexOf()和lastIndexOf() 10 數(shù)組類(lèi)型
檢測(cè)是否數(shù)組:
Array.isArray()
Object.prototype.toString.call()
console.log(Array.isArray([])); //True console.log(Object.prototype.toString.call([]).slice(8, -1)); //Array11 類(lèi)數(shù)組對(duì)象
創(chuàng)建類(lèi)數(shù)組對(duì)象
//新建空的Object,a let a = {}; //向a添加屬性 var i = 0; while (i < 10) { a[i] = i; i++ } //添加length屬性 a.length = i; //完成 //當(dāng)做數(shù)組遍歷它 for (var i = 0; i < a.length; i++) { console.log(a[i]); }; //輸出0-912 作為數(shù)組的字符串
字符串可以當(dāng)做數(shù)組,使用方括號(hào)語(yǔ)法訪問(wèn)數(shù)據(jù);但是字符串是不可變值,類(lèi)似Array.prototype.push()等方法不可用。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/79086.html
摘要:不過(guò)讓流行起來(lái)的原因應(yīng)該是是目前所有主流瀏覽器上唯一支持的腳本語(yǔ)言。經(jīng)過(guò)測(cè)試,數(shù)字字符串布爾日期可以直接賦值,修改不會(huì)產(chǎn)生影響。再考慮對(duì)象類(lèi)型為或者的情況。對(duì)于結(jié)果聲明其類(lèi)型。判斷對(duì)象的類(lèi)型是還是,結(jié)果類(lèi)型更改。 轉(zhuǎn)載自我的個(gè)人博客 歡迎大家批評(píng)指正 1. 第一個(gè)頁(yè)面交互 這里最需要學(xué)習(xí)的老師的代碼中,每一部分功能都由函數(shù)控制,沒(méi)有創(chuàng)建一個(gè)全部變量。且最后有一個(gè)函數(shù)來(lái)控制執(zhí)行代碼...
摘要:在同一個(gè)塊內(nèi),不允許用重復(fù)聲明變量。中為新增了塊級(jí)作用域。自帶遍歷器的對(duì)象有數(shù)組字符串類(lèi)數(shù)組對(duì)象對(duì)象的對(duì)象等和結(jié)構(gòu)對(duì)象。返回一個(gè)遍歷器,使遍歷數(shù)組的鍵值對(duì)鍵名鍵值。 目錄 1.語(yǔ)法 2.類(lèi)型、值和變量 3.表達(dá)式和運(yùn)算符 4.語(yǔ)句 5.數(shù)組 6.對(duì)象 7.函數(shù) 8.全局屬性和方法 9.詞法作用域、作用域鏈、閉包 10.原型鏈、繼承機(jī)制 11.this的理解 12.ES5新特性 13.E...
摘要:正則表達(dá)式一個(gè)描述字符模式的對(duì)象正則表達(dá)式的定義構(gòu)造函數(shù)正則表達(dá)式直接量一對(duì)斜杠新特性正則的擴(kuò)展引用類(lèi)型類(lèi)型的注意要點(diǎn)用于模式匹配的方法不支持全局搜索忽略表達(dá)式參數(shù)中的修飾符兩個(gè)參數(shù)第一個(gè)是正則表達(dá)式,第二個(gè)是要替換的字符串接收一個(gè)正則表達(dá) 正則表達(dá)式(regular expression):一個(gè)描述字符模式的對(duì)象 1 正則表達(dá)式的定義 RegExp()構(gòu)造函數(shù) 正則表達(dá)式直接量(一...
摘要:比如,以對(duì)象的方法的形式調(diào)用函數(shù)并傳入兩個(gè)參數(shù)可以傳入的參數(shù)可以是數(shù)組和類(lèi)數(shù)組的。方法的該方法主要作用是將函數(shù)綁定至某個(gè)對(duì)象,方法返回一個(gè)新的函數(shù),調(diào)用這個(gè)新的函數(shù)會(huì)把綁定的函數(shù)在對(duì)象中當(dāng)做方法來(lái)調(diào)用。 參數(shù) 形參(parameter):函數(shù)中定義的變量 實(shí)參(argument):運(yùn)行時(shí)的函數(shù)調(diào)用時(shí)傳入的參數(shù) 上下文(context):通過(guò)對(duì)象來(lái)調(diào)用函數(shù)時(shí),這個(gè)對(duì)象就是thi...
摘要:試用過(guò)幾回,不滿的地方,是一個(gè)框架,必須最好按它的方式來(lái)編碼,與混編,使用文件。經(jīng)過(guò)一翻網(wǎng)絡(luò)搜索,勉強(qiáng)明白了依賴(lài)更新的實(shí)現(xiàn)方式,便嘗試著自己去實(shí)現(xiàn)一個(gè)框架。如今有依賴(lài)更新這種技術(shù)的存在,我覺(jué)得找到了可能。 初接觸vue,驚為天人,它的更新方式極為取巧,但也是人們保持路人的原因:似乎沒(méi)有一個(gè)嚴(yán)格的數(shù)學(xué)證明保證按它的方式能精確更新到DOM。不過(guò)腦子里推演的似乎不會(huì)發(fā)生失敗,而且每次界面都能...
閱讀 2439·2021-11-23 09:51
閱讀 2471·2021-11-11 17:21
閱讀 3112·2021-09-04 16:45
閱讀 2397·2021-08-09 13:42
閱讀 2230·2019-08-29 18:39
閱讀 2898·2019-08-29 14:12
閱讀 1299·2019-08-29 13:49
閱讀 3373·2019-08-29 11:17