JS数组Array的全部方法汇总

本是古典何须时尚 2021-06-26 16:06 448阅读 0赞

//constructor属性
    var arr = [];
    arr.constructor === Array
    //true
    
    
    //prototype属性
    Array.prototype.max = function(){ 
    	var max = this[0];
    	for(var i = 1; i < this.length; i++){ 
    		if(this[i] > max){ 
    			max = this[i];
    		}
    	}
    	return max;
    }
    console.log([2, 5, 2, 1, 3, 8, 5].max());
    //8
    
    //Array.from属性
    function a(m, n, o){ 
    	return arguments;
    }
    a(1, 2, 3);		//返回的是类数组
    Array.from(a(1, 2, 3));		//返回的是数组
    Array.prototype.slice.call(a(1, 2, 3));		//返回的是数组
     
    //字符串
    Array.from('abc');
    //['a', 'b', 'c']
    //类似于'abc'.split('')
     
    //Set数据结构
    var setObj = new Set(['a', 'b', 'c']);
    var arr = Array.from(setObj);
    console.log(arr);
    //['a', 'b', 'c']
     
    //箭头语法和映射函数
    var arr = Array.from([1, 2, 3], x => x * 10);
    //[10, 20, 30]
    
    
    //Array.isArray()
    Array.isArray([]);		//true
    Array.isArray({ });		//false
    Array.isArray(null);	//false
     
    //注意：typeof不能够区分对象和数组
    typeof({ }) === 'object'
    typeof([]) === 'object'
    typeof(null) === 'object'
    typeof(undefined) === 'undefined'
    typeof(0) === 'number'
    typeof('0') === 'string'
    
    
    //Array.of()
    Array.of(1, 2, 3);		//[1, 2, 3]
    new Array(1, 2, 3);		//[1, 2, 3]
    //如果只有一个参数呢？
    Array.of(3);			//[3]
    new Array(3);			//[,,] 数组length为3，所有值均为undefined
    
    
    //concat()连接数组
    var a = [1, 2, 3];
    var b = [4, 5];
    var c = a.concat(b);			//[1, 2, 3, 4, 5]
    //也可用于连接字符串
    var d = c.concat('m', 'n');		//[1, 2, 3, 4, 5, m, n]
    
    
    //entries数组迭代器
    var e = ['a', 'b', 'c'].entries();
    e.next().value	=== [0, 'a'];
    e.next().value	=== [1, 'b'];
    e.next().value	=== [2, 'c'];
    //通过next()迭代返回数组的键值对
    //keys和entries用法相似，但只返回键值
    var e = ['a', 'b', 'c'].keys();
    e.next().value	=== 0;
    e.next().value	=== 1;
    e.next().value	=== 2;
    
    
    //every方法
    //该方法用来确保数组中的所有成员是否都满足条件，是的话返回true，否则false
    [1, 2].every(function(value){ 
    	if(value === 1 || value === 2){ 
    		return true;
    	}else{ 
    		return false;
    	}
    })
    //true
     
    //相对应的some方法
    //该方法会升序对数组的每一个元素调用，若遇到返回true的，直接返回true，如果都为false，则返回false，可以理解为只要数组中有一个元素满足条件，则返回true
    [1, 2, 3, 4].some(function(value){ 
    	if(value === 3){ 
    		return true;
    	}else{ 
    		return false;
    	}
    })
    //true
    [1, 2, 3, 4].some(function(value){ 
    	if(value === 5){ 
    		return true;
    	}else{ 
    		return false;
    	}
    })
    //false
    
    
    //fill方法
    //fill(val, start, end)方法用于填充数组，第一个参数为值，第二个参数为开始位置索引，第三个参数为结束位置索引
    [0, 0, 0].fill(7, 1);		//[0, 7, 7]
    [0, 0, 0].fill(7);			//[7, 7, 7]
     
     
    //filter方法
    //返回数组中满足回调函数条件的元素
    [1, 2, 3].filter(function(val){ 
    	if(val === 1 || val === 2){ 
    		return true;
    	}else{ 
    		return false;
    	}
    })
    //[1, 2]
    
    
    //findIndex方法
    //用回调函数遍历数组，直到回调函数返回true，则返回相应的索引，如果一直没有，则返回-1
    [1, 2, 3].findIndex(function(val){ 
    	return val === 2 ? true : false;
    })
    //1(数值2的索引是1)
    
    
    //forEach遍历
    [1, 2, 3].forEach(function(val, index, arr){ 
    	console.log(val);
    })
    //1 2 3
    
    
    //indexOf方法
    //用于判断数组中是否有相匹配的值，第二个参数表示从数组的某个开始位置往后检索
    [1, 2, 3, 4, 2].indexOf(2);			//1
    [1, 2, 3, 4, 2].indexOf(2, 2);		//4
    //lastIndexOf表示从数组最后一个元素开始检索
    
    
    //join方法拼接字符串
    [1, 2, 3].join('-');
    //1-2-3
    
    //map方法
    //注意：会返回一个新数组
    [1, 2, 3].map(function(val){ 
    	return val * 2;
    })
    //[2, 4, 6]
    
    
    //pop方法，移除最后一个元素并返回这个元素，如果数组为空，返回undefined
    [1, 2, 3].pop();	//3
    //shift方法，类似pop方法，移除第一个元素并返回这个元素
    [1, 2, 3].shift();	//3
    //push方法，数组尾部追加元素，注意，这会更改原数组，并且返回的是新数组的长度，如果参数是一个数组的话，会当成一个元素添加进去
    var arr = [1];
    var a = arr.push(2, 3);		//a = 3, arr = [1, 2, 3]
    var b = arr.push([4, 5]);	//b = 4, arr = [1, 2, 3, [4, 5]]
    //unshift方法，数组头部追加元素，注意，这会更改原数组，并且返回的是新数组的长度，同于push方法
    [1, 2, 3].unshift(9);	//4
    
    
    //reduce方法
    //对数组中的所有元素调用指定的回调函数，该回调函数的返回值为累计结果，并且在下一次调用该回调函数的时候作为参数提供
    //reduce(callback, initialValue)
     
    //第一种情况，没有初始值，第一次执行回调时，pre等于数组第一个元素，cur等于第二个元素
    [1, 2, 3].reduce(function(pre, cur){ 
    	return pre + '-' + cur;
    })
    //1-2-3
     
    //第二种情况，有初始值，第一次执行回调时，pre等于初始值，cur等于第一个元素
    [1, 2, 3].reduce(function(pre, cur){ 
    	return pre + '-' + cur;
    }, 8)
    //8-1-2-3
    
    
    //reduceRight方法
    //类似于reduce方法，对数组是逆序操作
    [1, 2, 3].reduceRight(function(pre, cur){ 
    	return pre + '-' + cur;
    })
    //3-2-1
     
    //运用此方法反转字符串
    Array.prototype.reduceRight.call('12345', function(pre, cur){ 
    	return pre + cur;
    })
    //54321
    
    
    //reverse方法反转数组元素
    //注意，此方法会修改原数组，并不会创建新数组
    [1, 2, 3].reverse();
    //[3, 2, 1]
    
    
    //slice方法
    //返回一个新数组，截取数组中的一部分，第一个参数为开始位置，第二个参数为结束位置，如果为负数的话，可以理解为数组的length加上这个start或者end的值，注意不包括end这个数
    [1, 2, 3, 4].slice(1);		//[2, 3, 4]
    [1, 2, 3, 4].slice(1, 2);	//[2]
    [1, 2, 3, 4].slice(-1);		//[4]
    [1, 2, 3, 4].slice(0, -1);	//[1, 2, 3]
     
    //splice方法，从数组中移除元素，如有必要，在移除的位置上插入新的元素，并返回移除的元素
    var a = [1, 2, 3, 4, 5, 6].splice(1, 2, 'a', 'b');
    //a = [2, 3]
    //数组变为[1, 'a', 'b', 4, 5, 6]
    
    
    //sort方法排序
    //注意，会操作原数组
    [6, 2, 5, 1].sort(function(a, b){ 
    	return a - b;
    })
    
    
    //toString方法
    [1, 2, 3, 4].toString();
    //1,2,3,4
    
    
    //valueOf方法，返回指定对象的基元值
    var arr = [1, 2];
    var s = arr.valueOf();
    arr === s
    //true
    
    
    //values方法，迭代器
    var v = [1, 2, 3].values();
    v.next().value === 1;
    v.next().value === 2;
    v.next().value === 3;