2017/5 JavaScript基礎7--- 數組
1、建立數組，數組操做
一、數組概述
數組是值的有序集合。每一個值叫元素，每一個元素在數組中都有數字位置編號，也就是索引，JS中的數組是弱類型的，數組中能夠含有不一樣類型的元素，數組元素甚至能夠是對象或其餘數組。javascript
var arr = [ 1, true, null ,undefined, { x : 1},[ 1,2,3 ] ];
arr[0]; // 1
arr[3]; //undefined
arr[4].x; //1
arr[5][1]; //2
二、建立數組
1）字面量
var TAB = ['Alibaba','Tencent','Baidu'];
var student = [{name:'Bosn',age:27},{name:'Nunnnly',age:3}];
var arrInArr = [[1,2],[3,4,5]];
var commasArr1 = [1,,2]; //1,undefined,2
var commasArr1 = [ , ,]; //undefined,undefined 理解爲兩個undefined,最後一個省略
數組大小限制：0 ~ 2的23次冪-1java
3）new Array
new能夠省略數組
var arr = new Array(); var arrWithLength = new Array(100); //undefined*100--只有一個參數認爲是數組大小，數組有100個元素 var arr = new Array(true,false,null,1,2,"hi"); //傳入多個參數，參數做爲傳入數組元素。 //等價於[true,false,null,1,2,"hi"]
三、數組元素讀寫
var arr = [1,2,3,4,5]; arr[1]; //2 arr.length; //5 長度 arr[5] = 6; arr.length; //6 delete arr[0]; //最終數組長度仍是6 把第一個值改成undefined arr[0]; //undefined
四、數組元素的增刪
1）數組長度是動態的，無需指定大小
var arr = []; arr[0] = 1; arr[1] = 2; arr;//[1,2]
2)增長元素
var arr = []; arr[0] = 1; arr[1] = 2; arr.push(3); //在尾部加入 arr; //[1,2,3] arr[arr.length] = 4; //equal to arr.push(4) --老是從末尾加 arr; //[1,2,3,4] //在頭部加入 arr.unshift(0); arr; //[0,1,2,3,4]
3)刪除元素
delete arr[2]; arr; // [0,1,undefined,3,4] delete 將第三個元素變爲undefined arr.length ; //5 2 in arr ; //false 會佔位但，索引不存在，key不存在了，若是arr[2] = undefined in 返回 true arr.length -= 1; //長度減小1 刪除尾部元素 arr; // [0,1,undefined,3] arr.pop(); //從尾部彈出最後一個,3被刪除了 arr ;[0,1,undefined] //頭部刪除 arr.shift(); //0刪除了 arr; //[1,undefined]
五、數組的迭代
var i=0,n=10;
var arr = [1,2,3,4,5];
for(; i<n;i++){
console.log()
}
for(i in arr){
console.log(arr[i]); //1,2,3,4,5
}
//數組對象的原型 Array.prototype，給原型添加屬性x在for in裏面也會出現
Array.prototype.x = 'inheritrd';
for( i in arr){
console.log(arr[i]); //1,2,3,4,5,inherint
}
for( i in arr){
if(arr.hasOwnProperty(i)){ //只打印屬於數組的屬性
console.log(arr[i]);//1,2,3,4,5
}
}
2、二維數組、稀疏數組
一、二維數組
var arr = [[0,1],[2,3],[4,5]]; //二維數組中有三個元素，每一個元素又是一個數組
var i =0 ;j =0;
var row ;
for(;i<arr.length;i++){
row = arr[i]; //獲取第一個數組
console.log('row' + i);
for(j=0;j<row.length;j++){
console.log(row[j]); //輸出第一個數組的值
}
}
二、稀疏數組
稀疏數組並不含有從0開始的連續索引。一半length屬性值比實際元素個數大。app
//arr一、arr2 都含有一個元素長度爲1 var arr1 = [undefined]; var arr2 = new Array(1); 0 in arr1; //true 第一個有元素值爲undefined 0 in arr2; //false 長度爲1，單第0個元素的 key是不存在的 arr1.length = 100; arr1[99] = 123; 99 in arr1 ; //true 98 in arr1 ; //false var arr = [,,]; //也是稀疏數組 0 in arr; //false
3、數組方法
{} => Object.prototype
[] => Array.prototype
一、數組方法分類
Array.prototype.join Array.prototype.reverse Array.prototype.sort Array.prototype.contcat Array.prototype.slice //切片 Array.prototype.splice //膠接 Array.prototype.forEach (ES5) Array.prototype.map (ES5) Array.prototype.every (ES5) Array.prototype.some (ES5) Array.prototype.reduce/reduceRight (ES5) Array.prototype.indexOf/lastIndexOf (ES5) Array.prototype.isArray (ES5)
1）將數組轉化爲字符串:Arrar.prototype.join（不改變原數組）
var arr = [1,2,3];
arr.join(); //"1,2,3" 默認以，分割
arr.join('_'); //"1_2_3"
//函數：重複某一個字符串n次 ，第一個參數，要重複的字符串，2.要重複幾回
// 將要重複的字符串做爲 分隔符 ，當使用空數組 join時 undefined 會被忽略掉。
function repeatString(str,n){
return new Array(n+1).join(str);
}
repeatString("a",3); //"aaa"
repeatString("Hi",5); "HiHiHiHiHi"
2)數組逆序: Array.prototype.reverse （修改原數組）
將數組逆序，會修改原數組，也會返回一個逆序數組函數
var arr = [1,2,3]; arr.reverse(); //返回一個顛倒的結果[3,2,1] arr; //會修改原數組[3,2,1] /* var b= arr.reverse(); //返回一個顛倒的結果[3,2,1] arr; //會修改 (3) [3, 2, 1] b; (3) [3, 2, 1] */
2) 排序：Array.prototype.sort （修改原數組）
1.默認按照字母順序排序
var arr = ["a","b","c"]; arr.sort(); //["a","b","c"]
2.數字排序
//會先把數字轉化爲字符串排序
arr = [13,24,51,3];
arr.sort();//[13,24,3,51]
arr;//[13,24,3,51] 修改原數組
//升序排列從小到大
arr.sort(function(a,b){
return a-b ; //傳入比較元素返回負數
}); //[3,13,24,51]
//降序排列從大到小
arr.sort(function(a,b){
return b-a ; //返回正數
});
3）數組對象結合
var arr = [{age:25},{age:39},{age:99}];
arr.sort(function(a,b){
return a.age - b.age //從小打大
});
//forEach 遍歷查看排序結果
arr.forEach(function(item){ //item爲對象
console.log('age' ,item.age);
})
//age 25
//age 39
//age 99
3）數組合並：ArrayPrototype.concat（不改變原數組）
var arr = [1,2,3]; var arr2 = arr.concat(4,5); //[1,2,3,4,5] arr; //[1,2,3] 不改變原數組 //一維數組會被拉平 var arr3 = arr.concat([10,11,12],13); //[1,2,3,10,11,13] //數組只會拉平一次，會保存子數組 var arr4 = arr.oncat([1,[2,3]]); // [1,2,3,1,[2,3]]
4）返回數組片斷：Array.prototype.slice（不修改原數組）
//不修改原數組 var arr = [1,2,3,4,5]; //返回 起始索引 到 結束索引-1 的元素 var arr2 = arr.slice(1,3) ; //[2,3] //從起始索引到最後 arr.slice(1); //[2,3,4,5] //負數索引，從後往前 -1：最後一個元素 arr.slice(1,-1) ; //[2,3，4] -1表明5 -1-1 ：4 arr.slice(-4,-3) ;//[2]
5)數組拼接： Array.prototype.splice（修改原數組）
一、刪除元素
//一個參數，表示從起始到結束 var arr = [1,2,3,4,5]; var arr1 = arr.splice(2); //return [3,4,5] 返回從第三個元素到最後一個元素，而且刪除 arr; //[1,2] 修改原數組 var arr = [1,2,3,4,5]; //從第三個元素開始(包括第三個)刪除兩個元素 var arr2 = arr.splice(2,2); //return [3,4] arr; //[1,2,5]
二、插入元素
var arr = [1,2,3,4,5]; //從第二個元素開始，刪除1個 插入 a,b var arr1 = arr.splice(1,1,'a','b'); //return[2]返回刪除的元素 arr; // [1,'a','b',3,4,5]
6）數組遍歷：Array.prototype.forEach
IE9及以上能夠spa
//遍歷每個數組元素
var arr = [1,2,3,4,5];
//forEach接受一個函數做爲參數，函數在遍歷到每個元素時調用。
//函數有三個參數，1.元素的值 2.元素索引 3.指向數組自己
arr.forEach(function(x, index, a){
console.log(x + '|' + index + '|'+ (a === arr))
})
/*
1|0|true
2|1|true
3|2|true
4|3|true
5|4|true
*/
7)數組映射：Array.prototype.map（不修改原數組）
改變數組中每個元素prototype
var arr = [1,2,3];
var arr2 = arr.map(funcyion(x){
return x+10;
}); //[11,12,13] 返回一個新的數組
arr;//[1,2,3] 原數組不變
8)數組過濾：Array.prototype.filter（不修改原數組）
篩選特定元素：篩選出索引模3 爲 0 或元素值 >=8;code
var arr = [1,2,3,4,5,6,7,8,9,10];
//參數 ：數組元素，索引
var arr2 = arr.filter(function(x,index){
return index % 3 ===0 || x>=8;
}); //returns [1,4,7,8,9,10]
arr; //[1,2,3,4,5,6,7,8,9,10]; //不修改原數組
9)數組判斷：Array.prototype.every & some
var arr = [1,2,3,4,5];
//檢查數組是不是每一個元素都小於10
//every 每一個都符合條件
arr.every(function(x){
return x < 10 ;
}); // 返回true
// 任意一個元素符合便可
arr.some(function(x){
return x === 3;
}); //true
10)兩兩操做數組元素：Array.prototype.reduce & reduceRight（不修改原數組）
var arr = [1,2,3];
//對元素求和
//1.函數中，表示數組中元素，2.可選參數，表明初始 x值，不傳就指向第一個元素
//首選傳入 0,1 求和取得 1，賦值給 x, y=2，繼續
var sum = arr.reduce(function(x,y){
return x+y;
}, 0 ) // 返回和·6
arr; //[1,2,3]
//比較大小
arr = [3,9,6];
var max = arr.reduce(function(x,y){
console.log(x +"|" +y);
return x>y ? x ：y
})
//3|9
//9|6
max;//9
//沒有穿第二個參數，第一次遍歷 x指向 3，y指向 9, 9>3 返回9 ，第二次 x=9,y=6,返回 9
reduceRight:從右到左開始遍歷其他同樣對象
10)數組檢索：Array.prototype.indexOf & lastIndexOf
//參數1 爲要查找的子串 ，參數2 爲起始查找位置排序
var arr = [1,2,3,2,1]; //檢索子串在數組中位置 arr.indexOf(2); //索引爲1 //從第二個元素開始查找 1 //參數1 爲要查找的子串 ，參數2 爲起始查找位置 arr.indexOf(1,1); //索引爲 4 //從 倒數第三個(-1爲倒數第一個)3開始搜索 1 arr.indexOf(1,-3); //索引爲 4 //從右向左找 arr.lastIndexOf(2); //3
11)判斷一個對象是否爲數組對象：Array.isArray
isArray是 Array構造器上的屬性，不能夠直接用一個變量調用
Array.isArray([]);//true
[] instanceof Array ;//true
({}).toString.apply([]) === '[object Array]'; //true
[].constructor === Array ; //true
4、數組與其餘元素的區別
一、數組與對象區別
1）相同
- 均可以繼承。
- 數組是對象，對象不必定是數組。
- 均可以當作對象添加刪除屬性。
2）不一樣
- 數組自動更新length。
- 按索引訪問數組，經常比訪問通常對象屬性迅速。
- 數組對象繼承Array.prototype上大量數組操做方法
二、數組與字符串區別
var str = "hello"; //能夠當作數組來訪問，類數組 str.charAt(0); //索引爲0 的字符"h" str[1];//e //但字符串沒有 contact join等數組特有方法，但由於是類數組 Array.prototype.join.call(str,"_"); //"h_e_l_l_o"
相關文章
- 1. JavaScript 數組基礎
- 2. 7 個基礎 JavaScript 函數
- 3. Java基礎(7).數組
- 4. JavaScript基礎知識-（數組）
- 5. JavaScript基礎——使用數組
- 6. JavaScript基礎知識——數組
- 7. 數組 - Javascript語法基礎 - Javascript核心
- 8. [譯] 7 個基礎 JavaScript 函數
- 9. Java基礎語法(7)-數組
- 10. Unity3D基礎7：Transform組件
- 更多相關文章...
- • R 語言基礎 - R 語言教程
- • Scala 基礎語法 - Scala教程
- • Flink 數據傳輸及反壓詳解
- • Kotlin學習（二）基本類型
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
