JS資料結構(一)——陣列

Jsp發表於2018-06-26
JS資料結構陣列

一：建立和初始化陣列

var arr = new Array(); //建立空陣列[]
var arr1 = new Array(7); //建立長度為7的陣列
var aar2 = new Array('1','2','3');
var arr3 = [];複製程式碼

二：陣列方法

常用方法：

  1. push() 新增元素到陣列的末尾
  2. unshift() 把數值插入到陣列的首位
  3. pop() 刪除陣列裡靠後的元素
  4. shift() 陣列首位刪除元素
  5. splice() 在任意位置新增或刪除元素

splice()方法接受的第一個引數，表示要刪除或插入的元素的索引值；第二個參數列示要刪除的元素的個數；第三個引數往後就是要新增到陣列裡的值。

其他核心方法：

  1. concat()  連線2個或更多陣列，並返回結果
  2. every() 對陣列中的每一項執行給定函式，如果該函式對每一項都返回true，就返回true
  3. filter() 對陣列中的每一項執行給定函式，返回該函式會返回true的項組成的陣列
  4. forEach() 對陣列中的每一項執行給定的函式，這個方法沒有返回值
  5. join() 將所有陣列練成一個字串
  6. indexOf() 返回第一個與給定引數相等的陣列的索引，沒有找到則返回-1
  7. lastIndexOf() 返回在陣列中搜尋到的與給定引數相等的元素的索引裡的最大值
  8. map() 對陣列中的每一項執行給定函式，返回每次函式呼叫的結果組成的陣列
  9. reverse() 顛倒陣列中元素的順序
  10. slice() 傳入索引值，將陣列裡對應索引範圍內的元素作為新陣列返回
  11. some() 對陣列中的每一項執行給定函式，如果任一項返回true，則返回true
  12. sort() 按照字母順序對陣列排序，支援傳入指定排序方法的函式做引數
  13. toString() 將陣列作為字串返回
  14. valueOf() 和toString()類似，返回指定物件的原始值
  15. reduce()方法  返回一個將被疊加到累加器的值，對所有元素求和

number.reduce(function(previous, current, index){
    return previous + current;
});複製程式碼

三:ES6和陣列的新功能

  • iterator  返回一個包含陣列鍵值對的迭代器物件，可以通過同步呼叫得到陣列元素的鍵值對
  • copyWithin 複製陣列中一系列元素到同一陣列指定的起始位置
  • entries 返回包含陣列所有鍵值對的@@iterator
  • includes 如果陣列中存在某個元素則返回true，否則返回false
  • find 根據回撥函式給定的條件從陣列中查詢元素，如果找到返回該元素
  • findIndex 根據回撥函式給定的條件從陣列中查詢元素，如果找到返回該元素在陣列中的索引
  • fill 用靜態值填充陣列
  • from 根據已有陣列建立一個新陣列
  • keys 返回包含陣列所有索引的@@iterator
  • of 根據傳入的引數建立一個新陣列
  • values 返回包含陣列中所有值的@@iterator

1、ES6引入for...of迴圈來迭代陣列

for(let n of numbers){
    console.log(n); //列印陣列元素
}複製程式碼

2、使用ES6新的迭代器（@@iterator）

ES6為Array類增加類一個@@iterator屬性，需要通過Symbol.iterator來訪問

var num = [1,2,3]
let iterator = num[Symbol.iterator]();
console.log(iterator.next().value); //1
console.log(iterator.next().value); //2
console.log(iterator.next().value); //3
console.log(iterator.next().value); //undefined
複製程式碼

3、陣列的entries、keys和values方法

entries方法包含鍵值對的@iterator

var num = [1,2,3]
let aentries = num.entries();
console.log(aentries.next().value); //[0,1]
console.log(aentries.next().value); //[1,2]
console.log(aentries.next().value); //[2,3]
console.log(aentries.next().value); //undefined

複製程式碼

4、key方法包含陣列索引的@@iterator

var num = [1,2,3]
let keys = num.keys();
console.log(keys.next()); //{ value: 0, done: false }
console.log(keys.next()); //{ value: 1, done: false }
console.log(keys.next()); //{ value: 2, done: false }
console.log(keys.next()); //{ value: undefined, done: true }
複製程式碼

5、values方法同理返回包含的值

6、from方法根據已有的陣列建立一個新陣列

var num = [1,2,3]
let num1 = Array.from(num); //[1, 2, 3]
let num2 = Array.from(num, x => (x + 2)); //[3, 4, 5]
複製程式碼

7、Array.of方法根據傳入的引數建立一個新陣列

let num1 = Array.of(1); //[1]
let num2 = Array.of(1,23,45); //[1, 23, 45]
複製程式碼

8、fill方法

let num = [1,2,34,5,6,7];
let num1 = num.fill(0,2,4);
console.log(num); //[1, 2, 0, 0, 6, 7]
console.log(num1); //[1, 2, 0, 0, 6, 7]
複製程式碼

9、copyWithin方法

let num = [1,2,34,5,6,7];
let num1 = num.copyWithin(1,3,5);
console.log(num); //[1, 5, 6, 5, 6, 7]
console.log(num1); //[1, 5, 6, 5, 6, 7]複製程式碼

把位置3開始到5結束（不包括5）的元素複製到位置1


相關文章