sailei1 / blog

1 stars 0 forks source link

JS array 各方法及用法 #91

Closed sailei1 closed 5 years ago

sailei1 commented 5 years ago
var arr=[{ name: 'b', index: '2' },{ name: 'c', index: '3' }];
//splice 用法 (会改变原数组)
var pos= arr.map(item=>item.index).indexOf('2') //查找索引
arr.splice(0,0,{name:'a',index:'1'}) //新增
arr.splice(1,1,{name:'b',index:'2-1'})//修改
arr.splice(1,1) //删除

arr.forEach(function (item, index, array) {
    console.log(item.name, index,array); 
});

arr.push({name:'t',index:'0'}) //尾部添加 可多个
arr.pop() //获取尾部元素 并删除
arr.shift() //获取头部元素 并删除
arr.unshift({name:'a',index:'1'}) //头部添加 可多个

var shallowCopy = arr.slice(); //复制数组 不改变原数组
 arr.slice(2, 4) //复制下标2-4 为新数组

//from 用法
console.log(Array.from('abc')); //["a", "b", "c"]

console.log(Array.from([1, 2, 3], x => x + x)); //[2, 4, 6] 

//isArray 用法
Array.isArray([1, 2, 3]); //true

//of
Array.of(7);       // [7] 
Array.of(1, 2, 3); // [1, 2, 3]

//concat
const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
array1.concat(array2) //["a", "b", "c", "d", "e", "f"]
sailei1 commented 5 years ago

copyWithin()方法浅复制数组的一部分到同一数组中的另一个位置,并返回它,不会改变原数组的长度。 Array.prototype.copyWithin(target, start = 0, end = this.length) 该函数有三个参数。

target:目的起始位置。 start:复制源的起始位置,可以省略,可以是负数。 end:复制源的结束位置,可以省略,可以是负数,实际结束位置是end-1。

var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
arr1.copyWithin(1, 3, 6) //[1,  4, 5, 6,  5, 6, 7, 8, 9, 10, 11]

fill() 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。

var array1 = [1, 2, 3, 4];
array1.fill(0, 2, 4) //[1, 2, 0, 0]  0填充值 2 开始下标 4 结束下标 (end-1)
sailei1 commented 5 years ago

entries() 方法返回一个新的Array Iterator对象,该对象包含数组中每个索引的键/值对。

const array1 = ['a', 'b', 'c'];
const iterator1 = array1.entries();

console.log(iterator1.next().value); //[0, "a"]
console.log(iterator1.next().value); //[1, "b"]
console.log(iterator1.next().value); //[2, "c"] 
console.log(iterator1.next().value); // undefined

values() 方法返回一个新的 Array Iterator 对象,该对象包含数组每个索引的值

const array1 = ['a', 'b', 'c'];
const iterator = array1.values();
console.log(iterator.next().value); //a
console.log(iterator.next().value);  //b
console.log(iterator.next().value);  //c
console.log(iterator.next().value);   //undefined

keys() 方法返回一个新的 Array Iterator 对象,该对象包含数组每个索引。

const array1 = ['a', 'b', 'c'];
const iterator = array1.keys();
console.log(iterator.next().value); //0
console.log(iterator.next().value);  //1
console.log(iterator.next().value);  //2
console.log(iterator.next().value);   //undefined
sailei1 commented 5 years ago

every() 方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。 若收到一个空数组,此方法在一切情况下都会返回 true。

var array1 = [1, 30, 39, 29, 10, 13];
array1.every((item)=>item>0) //true
array1.every((item)=>item>10)//false

some() 方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。 如果用一个空数组进行测试,在任何情况下它返回的都是false。

[2, 5, 8, 1, 4].some(item=>item>10) //false

[2, 5, 8, 1, 4].some(item=>item>5)//true

map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。

var array1 = [1, 2, 3, 4];
array1.map(x=>x*2) //[2, 4, 6, 8]
sailei1 commented 5 years ago

filter()

var array1 = [1, 2, 3, 4];
array1.filter(item=>item<3) //[1,2] filter不会改变原数组,它返回过滤后的新数组。

find() findIndex()

var arr=[{ name: 'b', index: '2' },{ name: 'b', index: '3' }];
arr.find(item=>item.name=='b') // { name: 'b', index: '2' } 返回最近那个
arr.findIndex(item=>item.name=='b') //0  返回最近那个

includes() 方法用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回false。

注意:对象数组不能使用includes方法来检测。

[1, 2, 3].includes(2);     // true
[1, 2, 3].includes(4);     // false
sailei1 commented 5 years ago

join() //连接

var arr=[1,2,3]
arr.join('-') //'1-2-3'

toString()

const array1 = [1, 2, 'a', '1a'];
console.log(array1.toString()); //"1,2,a,1a"

//reduce()

var arr = [23,123,342,12];
var max = arr.reduce(function(pre,cur,inde,arr){return pre>cur?pre:cur;});

let arr = [{"all": 1}, {"all": 2}, {"all": 3}, {"all": 4}, {"all": 1}];
let hash = {};
arr = arr.reduce((item, next) => {
  hash[next.all] ? "" : hash[next.all] = true && item.push(next);
  return item
}, []);  //对象数组去重
console.log(arr);
reduceRight()  //与reduce() 用法一样 只不过从数组尾部开始

reverse() 数组反转 会改变原数组

var numbers = [4, 2, 5, 1, 3]; 
numbers.reverse(); //[3, 1, 5, 2, 4]

sort() 排序 会改变原数组

var numbers = [4, 2, 5, 1, 3]; 
numbers.sort((a, b) => a - b);  //[1, 2, 3, 4, 5]
sailei1 commented 5 years ago

//flat() 方法会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。 //使用 Infinity,可展开任意深度的嵌套数组

var arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity);
var arr1 = [1, 2, 3, 4];

arr1.map(x => [x * 2]);  // [[2], [4], [6], [8]]

arr1.flatMap(x => [x * 2]);// [2, 4, 6, 8]
sailei1 commented 5 years ago

indexOf()方法返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1

const beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];
console.log(beasts.indexOf('bison'));//1

lastIndexOf() 方法返回指定元素(也即有效的 JavaScript 值或变量)在数组中的最后一个的索引,如果不存在则返回 -1。从数组的后面向前查找,从 fromIndex 处开始。

const animals = ['Dodo', 'Tiger', 'Penguin', 'Dodo'];

console.log(animals.lastIndexOf('Dodo'));//3
console.log(animals.lastIndexOf('Tiger'));//1 
sailei1 commented 4 years ago

数组对象属性 去重 [...new Set(arr.map((item)=>item[key]))]