Skip to main content

js 数组方法及其返回值

JavaScript 中的数组本质上是对象,是通过对象的 key 和 value 键值对来模拟的数组

  • 创建数组
  • 拼接数组

方法一:join() 将数组拼接成字符串 : 返回拼接好的字符串

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

方法二:concat() 拼接两个数组,原数组不变 : 返回拼接后的新数组

var arr = [1,2,3]
arr.concat([5, 6])
// [1,2,3,5,6]
  • 存取数组

方法一:可以通过 push() 方法在数组尾部添加元素:返回修改后数组的长度

let arr = [0,1,2,3,4];
arr.push(5); //向数组尾部添加元素5
console.log(arr); //[0,1,2,3,4,5]

方法二:可以通过 unshift() 方法向数组首部添加元素:返回数组的长度

let arr = [0,1,2,3,4];
arr.unshift(5); //向数组头部添加元素 5
console.log(arr); //[5,0,1,2,3,4]

方法三:可以通过 splice() 方法向数组任意位置添加元素:

let arr = [0,1,2,3,4];

arr.splice(2,1,'x') //在下标为2的位置删除1个元素,并插入 'x'
console.log(arr); //[0,1,'x',3,4]

arr.splice(2,0,'x','y') //在下标为2的位置删除0个元素,并插入 'x','y'
console.log(arr); //[0,1,'x','y','x',3,4]
  • 查看数组

方法一:可以通过 Object.keys() / Object.values 方法查看数组的属性名 / 属性值:

let arr = [0,1,2,3,4];
arr.x = 'x'; //通过点运算符给数组添加元素,但是数组的 length 属性并未改变,仍然是 5
console.log(Object.keys(arr)); //["0","1","2","3","4","×"]
console.log(Object.values(arr)); //[0,1,2,3,4,'x']

方法二:通过 indexOf()、find()、findIndex() 方法查找某个元素是否在数组里:

let arr = [0,1,2,3,4];

console.log(arr.indexOf(3)); //3 存在返回索引,否则返回-1

arr.find( item => item%2 === 0 ); //找第一个偶数,会返回 2
arr.findIndex( item => item%2 === 0 ); //找第一个偶数的索引,会返回 2

方法三:可以通过 forEach() 方法遍历查看数组元素

let arr = [0,1,2,3,4];
arr.forEach( function(item,index){ //forEach函数的参数接收一个回调函数
console.log(`${index}:${item}`); //回调函数中传递数组的item值和index下标
} )

方法四:includes() 查找数组中的元素有则 : 返回 true 否则 false

var arr = [1,2,3]
arr.includes(1)
// true

注: 区别, 增强了对 NaN 的判断, 用 indexof 在数组中找 NaN 必定返回-1 而 includes 方法则会正确找到

  • 截取数组
    截取数组.原数组不变

有两个参数: 都是数组下标 参数有一个时: 返回去掉这些项后的新数组

var arr = [1,2,3]
arr.slice(1)
// [2,3]

参数有两个时: 返回截取的新数组

var arr = [1,2,3]
arr.slice(1,2)
// [2]

方法三:可以通过 splice() 方法删除,添加,替换数组元素, 改变原数组 参数有两项时: 从第 0 项开始,删除两项. 返回被删除的数组元素 [1,2]

var arr = [1,2,3]
arr.splice(0,2)
/ / [3]

参数有三项及以上: 从第二项开始删除一项:将 2 删了,添加进 10,11 进数组. 返回被删除的数组元素

var arr = [1,2,3]
arr…splice(2, 1, 10,11)
// [1,10,11,3]

如果第二个参数为 0 则代表只增加元素 : 返回空数组

var arr = [1,2,3]
arr…splice(2, 0, 10,11)
// [1,2,10,11,3]
  • 删除数组

方法一:可以通过 shift() 方法删除数组头部元素:返回移除的项; 数组为空的则返回 underfined

let arr = [0,1,2,3,4,5];
let temp = arr.shift(); //删除数组头部元素,此时arr被修改,并返回被删元素
console.log(temp); //0 表示被删除的元素为0
console.log(arr); //[1,2,3,4,5]

方法二:可以通过 pop() 方法删除数组尾部元素:返回移除的项

let arr = [0,1,2,3,4,5];
let temp = arr.pop(); //删除数组尾部元素,此时arr被修改,并返回被删元素
console.log(temp); //5 表示被删除的元素为0
console.log(arr); //[0,1,2,3,4]
  • 数组元素排序

方法一:可以使用 reverse() 方法反转数组中的元素:返回翻转后的变化后的原数组

var a = [1,2,3,4,5]; //定义数组
a.reverse(); //颠倒数组顺序,reverse() 能够在原数组的基础上颠倒数组元素的排列顺序,该方法不需要参数。
alert(a); //这回数组[5,4,3,2,1]
//快速反转一个字符串
let str = 'abcde';
str.split('').reverse().join(''); //先将str字符串split()成一个数组,数组的reverse()方法,再join()将数组元素练成字符串

方法二:可以通过 sort() 方法对数组元素进行自定义排序:返回变化后的原数组

let arr = [3,1,5,2,4]; //乱序数组
arr.sort();
console.log(arr); //[1,2,3,4,5]
//箭头函数
let arr = [3,1,5,2,4]; //乱序数组
arr.sort( (value1,value2) => value1-value2 ); //正序
arr.sort( (value1,value2) => value2-value1 ); //反序
//同上
function compare(value1,value2){ //排序函数 if(valuel < value2){ return 1; }else if (value1 > value2){ return -1; }else{ return 0;
}
function compare(value1,value2){ //排序函数的改写 return (value2 - value1) //返回比较参数
}

ar arr = [3,1,2,4,5,7,6,8,0,9]; //定义数组
arr.sort(compare); //根据数字大小由小到大进行排序
alert(arr); //返回数组[0,1,2,3,4,5,6,7,8,9]

参考文章:https://www.huaweicloud.com/articles/fcbe765b1edf5f7799769a906f301b3d.html https://blog.csdn.net/wwyyzz1997/article/details/106079380#11join_4

continue ,break,return 这三个关键字的区别

  • return :直接跳出当前的方法,返回到该调用的方法的语句处,继续执行
  • break:在循环体内结束整个循环过程,会继续执行该循环之后的代码 (退出循环)
  • continue :结束本次的循环,直接进行下一次的循环

参考文章:https://www.codenong.com/jsab8b2de3ca24/