數組
-
定義
一個存儲元素的線性集合，元素可以通過索引來任意存取，索引通常是數字，用來計算元素之間存儲位置的偏移量。
-
效率低於其他語言 ❓
JavaScript中的數組是一種特殊的對象，用來表示偏移量的索引是該對象的屬性，索引可能是整數。然而，這些數字索引在內部被轉換爲字符串類型，這是因爲JavaScript對象中的屬性名必須是字符串。數組在JavaScript中只是一種特殊的對象，所以效率上不如其他語言中的數組高。 -
創建數組
-
簡單方式
let arr=[]; -
在以上空數組中放入一組元素
let arr=[a,b,c]; -
Array
let arr=new Array(); console.log(arr.length); //0 -
爲以上構造函數傳入一組元素作爲數組的初始值
let arr=new Array(a,b,c); console.log(arr.length); //3 -
在調用
Array的構造函數時，可以只傳入一個參數，用來指定數組的長度let arr=new Array(6); console.log(arr.length); //6 -
在腳本語言裏很常見的一個特性是:數組中的元素不必是同一種數據類型，這一點和很多
編程語言不同，如下所示:let arr = [1, "Joe", true, null]; console.log(Array.isArray() ); //false
-
以上創建數組的幾種方式中推薦使用[] 操作符和 Array，效率高點。
-
讀寫數組
-
使用
[]操作符將數據賦給數組let nums = []; for (let i = 0; i < 100; ++i) { nums[i] = i+1; } -
使用
[]操作符讀取數組中的元素let numbers = [1,2,3,4,5]; let sum = numbers[0] + numbers[1] + numbers[2] + numbers[3] +numbers[4]; console.log(sum); // 顯示 15數組中的元素較少時可以用以上方式讀取，如果元素叫多呢❓👇👇👇
-
for循環讀取數組中的元素
var numbers = [1, 2, 3, 5, 8, 13, 21]; var sum = 0; for (var i = 0; i < numbers.length; ++i) { sum += numbers[i]; } console.log(sum); // 53
-
-
由字符串生成數組 —— split()
var sentence = "hello world !"; var words = sentence.split(" "); for (var i = 0; i < words.length; ++i) { console.log("word " + i + ": " + words[i]); /** * word 0: hello * word 1: world * word 2: ! */ } -
深拷貝與淺拷貝
-
原始數據類型和對象類型賦值時的差異
JavaScript的數據類型分爲原始數據類型和對象類型。二者在內存中存放的方式不同，導致了其賦值時差異。分別舉個🌰：
var x = 1; var y = x; //y獲得了和x同樣的值 y = 2; console.log(x); // 1 var m = [1,2]; //m存放的是指向[1,2]這個數組對象的引用地址 var n = m; //n也獲得 [1,2]數組對象的引用地址 n[0] = 3; console.log(m); //[3,2] -
淺拷貝
-
定義
淺拷貝就是流於表面的拷貝方式；當屬性值爲對象類型時，只拷貝了對象數據的引用，導致新舊數據沒有完全分離，還會互相影響:
-
🌰
var array1 = ['a', 1, true, { name: 'lei', age: 18 }]; //concat()實現淺拷貝 var array2 = array1.concat() //修改拷貝後的數據 array2[0] = 'b'; //array1[0]是原始數據類型 所以是直接賦值的 array2[3].name = 'zhang'; //array1[3]是對象數據類型 所以拷貝的是對象的引用，其實還是和原數組使用同一對象 console.log(array1); // ['a',1,true,{name:'zhang',age:18}] console.log(array2); // ['b',1,true,{name:'zhang',age:18}]
array2是array1的淺拷貝對象，數組元素是原始數據類型的不會相互影響了（array1[0]），但是array1[3]是對象類型，還是會互相影響。 -
-
深拷貝
-
定義
從淺拷貝解釋基本可以明白，深拷貝就是 ‘完全’拷貝，拷貝之後新舊數據完全分離，不再共用對象類型的屬性值，不會互相影響。
-
🌰
var test = [1, 'a', { name: 'Anna', age: 18 }]; var copy1 = JSON.parse(JSON.stringify(test)); //特殊方式 console.log(copy1); //[1,'a',{name:'Aris',age:18}] copy1[2].name = 'Aris' console.log(test); //[1,'a',{name:'lei',age:18}] 未受到影響
-
-
造成深淺拷貝的原因
對象類型數據複製時，複製了引用地址，用的還是同一個數據對象；所以實現深拷貝的方式就是要對 對象類型屬性值遞歸進行深拷貝，避免直接賦值。
-
-
存取函數
JavaScript 提供了一組用來訪問數組元素的函數，叫做存取函數，這些函數返回目標數組
的某種變體。-
查找元素
-
indexOf
用來查找傳進來的參數在目標數組中是否存在。
let arr=[1,2,4,3]; let obj=arr.indexOf(5); console.log(obj); //-1 console.log([NaN].indexOf(NaN)); //-1 -
find
用於找出第一個符合條件的數組成員。
let arr=[1, 4, -5, 10]; let result=arr.find((n) => n < 0); console.log(result); //-5 -
findIndex
返回第一個符合條件的數組成員的位置，如果所有成員都不符合條件，則返回
-1。let arr = [1, 4, -5, 10]; let result = arr.findIndex((value) => { return value > 9; }) console.log(result); //3
-
-
數組轉換爲字符串
-
join()
let arr=['Anna','Alice','Aaron']; let result1=arr.join(); console.log(result1); //Anna,Alice,Aaron -
toString()
let arr=['Anna','Alice','Aaron']; let result2=arr.toString(); console.log(result2); //Anna,Alice,Aaron
-
-
已有數組創建新數組
-
concat()
concat方法可以合併多個數組創建一個新數組。let arr1 = [1, 2, 3]; let arr2 = [4, 5]; let result = arr1.concat(arr2); console.log(result); //[1, 2, 3, 4, 5] let result1=result.concat(arr1); console.log(result1); //[1, 2, 3, 4, 5, 1, 2, 3] -
splice()
splice()方法從現有數組裏截取一個新數組。let arr1=[1,2,3,4,5,6]; let arr2=arr1.splice(2,3); console.log(arr2); //3,4,5
-
-
-
可變函數
簡單來說，就是函數的參數個數可變，參數類型不定的函數。
-
爲數組添加元素
-
push()
let arr=[1,2,3,4]; let result=arr.push(5,6,7); console.log(result); //7 console.log(arr); //[1, 2, 3, 4, 5, 6, 7] -
unshift()
unshift()方法可以將元素添加在數組的開頭。let arr=[3,4]; let result=arr.unshift(1,2); console.log(result); //4 console.log(arr); //[1, 2, 3, 4]
-
-
從數組中刪除元素
-
pop()
pop()方法可以刪除數組末尾的元素。let arr=[1,2,3,4,5]; let result=arr.pop(); console.log(arr); //[1, 2, 3, 4] -
shift()
shift()方法可以刪除數組的第一個元素。let arr=[1,2,3]; arr.shift(); console.log(arr); //[2, 3]
-
-
爲數組排序
-
reverse
reverse()，該方法將數組中元素的順序進行翻轉。let arr=[1,21,3,4]; arr.reverse(); console.log(arr); //[4, 3, 21, 1] -
sort()
let arr=[1,32,4,2,20]; arr.sort(); console.log(arr); //[1, 2, 20, 32, 4]爲了讓
sort()方法也能排序數字類型的元素，可以在調用方法時傳入一個大小比較函數，排序時，sort()方法將會根據 該函數比較數組中兩個元素的大小，從而決定整個數組的順序。👇👇👇let arr = [1, 32, 4, 2, 20]; arr.sort((a,b)=>{ return a-b; }); console.log(arr); //[1, 2, 4, 20, 32]
-
-
-
迭代器方法
這些方法對數組中的每個元素應用一個函數，可以返回一個值、一組值或者一個新數組。
-
forEach
function square(num) { console.log(num, num * num); /** * 1 1 * 2 4 * 3 9 * 4 16 */ } var nums = [1, 2, 3, 4]; nums.forEach(square); -
every()
該方法接受一個返回值爲布爾類型的函數，對數組中的每 個元素使用該函數。
function isEven(num) { return num % 2 == 0; } var nums = [2, 4, 6, 8, 10]; var even = nums.every(isEven); if (even) { console.log("all numbers are eve"); //all numbers are eve } else { console.log("not all numbers are even"); }
-