js数组简述

一：Array.of()

var a = Array.of(1,2);
console.log(a)             //a =[1,2]


var b = Array.of(8.0)
console.log(b)            //b=[8]    

var c = Array(8.0)
console.log(c)           //c=[undefined...undefined]   长度为八。

有上代码可知，Array.of（）就是将参数转化为数组值，然后返回新数组。

 

二：Array.from()

该方法的作用就是根据类数组生成新的数组。

该方法有三个参数，第一个为类数组对象（set,map，等等），第二个参数是加工函数，是对类数组对象值得处理。第三个参数是指定this的作用域。后两个参数可选。第一个必选。

var obj = {0: 'a', 1: 'b', 2:'c', length: 3};

var a = Array.from(obj, function(value, index){
  console.log(value, index, this, arguments.length);
  return value.repeat(3);                           //必须指定返回值，否则返回undefined
}, obj);


//控制台打印：
a 0 {0: "a", 1: "b", 2: "c", length: 3} 2
b 1 {0: "a", 1: "b", 2: "c", length: 3} 2
c 2 {0: "a", 1: "b", 2: "c", length: 3} 2

//说明加工函数的第一个参数是类数组的值，第二个参数是相对应的索引。

console.log(a)       //['aaa','bbb','ccc']   说明加工函数return的值就是新数组。   



var d = Array.from('abc')

console.log(d)    //    ['a','b','c']    

三：Array.isArray()

该方法用于判断一个对象是否是数组

//ES5的判断方式

Array.prototype.toString.apply(array)==='[object Array]'


//ES6判断方式

Array.isArray(array) 

四：基于ES6，改变自身值的方法一共有9个，分别为pop、push、reverse、shift、sort、splice、unshift，以及两个ES6新增的方法copyWithin 和 fill。下面简单说明：

1:pop()       :  删除一个数组中的最后的一个元素，并且返回这个元素

2:push()     :添加一个或者多个元素到数组末尾，并且返回数组新的长度

3:reverse() :颠倒数组中元素的位置，该方法返回对数组的引用

4:shift（）        ：删除数组的第一个元素，并返回这个元素

5：sort()           : 对数组进行排序

6：splice()      

有三个参数，第一个为索引值，第二个为删除的个数，第三个参数是需要插入的新元素，

返回值 由原数组中被删除元素组成的数组，如果没有删除，则返回一个空数组

7：unshift()        ：在数组开始处插入一些元素，并返回数组新的长度

8：copyWithin()   :用于数组内元素之间的替换，即替换元素和被替换元素均是数组内的元素

var a = ['a','b','c','d','e'];

//参数0代表被替换元素的起始索引
//参数3代表替换元素的索引，这里就是指'd', 然后‘d’将‘a’替换
var b = a.copyWithin(0,3)   

console.log(b)    // ['d','b','c','d','e']  


var a =  ['a','b','c','d','e'];

//参数4代表替换元素的结束索引，但不包括它。这里4指带 'e'

var b = a.copyWithin(0,3,4)   //['d','b','c','d','e'];



var a =  ['a','b','c','d','e'];

//当参数是负数时，加上数组长度转化为整数即可   （0，-2，-1）=》（0,3,4）
var b = a.copyWithin(0,-2,-1)   //['d','b','c','d','e'];

9: fill()   :它主要用于将数组指定区间内的元素替换为某个值

var a = [6,7,8,9,10];

//该方法有三个参数：
//第一个替换的值：这里是10
//第二个参数： 被代替的起始索引（包含自己）0

//第三个参数： 被代替的终止索引 （不包含）这里就不是3而是2   [6,7,8]

var b = a.fill(10,0,3) 

console.log(b)   //   [10,10,10,9,10]

五：基于ES7，不会改变自身的方法一共有9个，分别为concat、join、slice、toString、toLocateString、indexOf、lastIndexOf、未标准的toSource以及ES7新增的方法includes。

1：concat()

var array = [1, 2, 3];
var array2 = array.concat(4,[5,6],[7,8,9]);
console.log(array2); // [1, 2, 3, 4, 5, 6, 7, 8, 9]

2:join()

var array = ['We', 'are', 'Chinese'];
console.log(array.join()); // "We,are,Chinese"
console.log(array.join('+')); // "We+are+Chinese"

3:slice()     :将数组中一部分元素浅复制存入新的数组对象，并且返回这个数组对象

var array = ["one", "two", "three","four", "five"];
var array2 = array.slice(2,3);
console.log(array2); // ["three"]

4:toString() :返回数组的字符串形式，该字符串由数组中的每个元素的 toString() 返回值经调用 join() 方法连接（由逗号隔开）组成。

var array = ['Jan', 'Feb', 'Mar', 'Apr'];
var str = array.toString();
console.log(str); //     Jan,Feb,Mar,Apr

5:toLocalString()

6:indexOf()        该方法用于查找元素在数组中第一次出现时的索引，如果没有，则返回-1

var array = ['abc', 'def', 'ghi','123'];
console.log(array.indexOf('def')); // 1
console.log(array.indexOf('def',-1)); // -1 此时表示从最后一个元素往后查找,因此查找失败返回-1
console.log(array.indexOf('def',-4)); // 1 由于4大于数组长度,此时将查找整个数组,因此返回1
console.log(array.indexOf(123)); // -1, 由于是严格匹配,因此并不会匹配到字符串'123'

7：lastIndexOf(): 该方法用于查找元素在数组中最后一次出现时的索引，如果没有，则返回-1。并且它是indexOf的逆向查找，即从数组最后一个往前查找。

 

8：includes()   该方法用来判断当前数组是否包含某个指定的值，如果是，则返回 true，否则返回 false。

//该方法第二个参数代表从何处开始判断。

var array = [1, 2, NaN];
console.log(array.includes(1)); // true
console.log(array.includes(NaN)); // true
console.log(array.includes(2,-4)); // true

六：遍历数组的方法有12个

1：forEach()    该方法指定数组的每项元素都执行一次传入的函数，返回值为undefined。

2：every()     当所有数组元素返回true时，该方法返回true，否则返回false

3: some()        只要存在返回true的情况，该函数就返回true

4:filter()        该方法使用传入的函数测试所有元素，并返回所有通过测试的元素组成的新数组

var array = [18, 9, 10, 35, 80];
var array2 = array.filter(function(value, index, array){
  return value > 20;
});
console.log(array2); // [35, 80]

5:map()     该方法遍历数组，使用传入函数处理每个元素，并返回函数的返回值组成的新数组。

6：reduce()     

reduce() 方法接收一个方法作为累加器，数组中的每个值(从左至右) 开始合并，最终为一个值。

语法：arr.reduce(fn, initialValue)

fn 表示在数组每一项上执行的函数，接受四个参数：

• previousValue 上一次调用回调返回的值，或者是提供的初始值
• value 数组中当前被处理元素的值
• index 当前元素在数组中的索引
• array 数组自身

initialValue 指定第一次调用 fn 的第一个参数。

当 fn 第一次执行时：

• 如果 initialValue 在调用 reduce 时被提供，那么第一个 previousValue 将等于 initialValue，此时 item 等于数组中的第一个值；
• 如果 initialValue 未被提供，那么 previousVaule 等于数组中的第一个值，item 等于数组中的第二个值。此时如果数组为空，那么将抛出 TypeError。
• 如果数组仅有一个元素，并且没有提供 initialValue，或提供了 initialValue 但数组为空，那么fn不会被执行，数组的唯一值将被返回。

   

var array = [1, 2, 3, 4];
var s = array.reduce(function(previousValue, value, index, array){
  return previousValue * value;
},1);
console.log(s); // 24

7: find() &&findIndex()

find() 方法基于ECMAScript 2015（ES6）规范，返回数组中第一个满足条件的元素（如果有的话）， 如果没有，则返回undefined。

findIndex() 方法也基于ECMAScript 2015（ES6）规范，它返回数组中第一个满足条件的元素的索引（如果有的话）否则返回-1。

var array = [1, 3, 5, 7, 8, 9, 10];
function f(value, index, array){
  return value%2==0; // 返回偶数
}
function f2(value, index, array){
  return value > 20; // 返回大于20的数
}
console.log(array.find(f)); // 8
console.log(array.find(f2)); // undefined
console.log(array.findIndex(f)); // 4
console.log(array.findIndex(f2)); // -1

具体查看：https://www.jqhtml.com/6306.html