JavaScript数组所有方法

大家好,我是小材鸟,本篇博客将带你了解javascrpit数组所有方法,如果觉得本篇对你有帮助  的话,可以给博客点一个👍吗?谢谢🌹

定义数组

new Array(1,2,3,4,5,6,7,89,9) var a = [1,2,3,4,5,6,7,8,9]

数组中的方法:

push()

向数组的最后添加一个或多个元素

返回数组的长度

unshift()

向数组的开头添加一个或多个元素

返回新数组的长度

pop()

删除数组的最后一位

返回被删除的数据

shift()

移出数组的第一项

返回被删除的数据

reverse()

反转数组的元素

返回反转后的新数组

sort()

以字母的顺序对数组进行排序

返回新数组

splice()

数组任意位置增删改

返回删除数据所组成的数组

concat()

通过合并现有数组来创建一个新数组

返回合并后的数组

join()

用特定的字符,将数组拼接成一个字符串

返回拼接后的字符串

slice()

剪切指定位置的数组

被剪切的元素形成的数组

toString()

将数组转换为字符串

字符串

valueOf()

查询数组原始值

数组的原始值

indexOf()

查询某个元素在数组中第一次数显的位置

存在该返回元素,返回下标,不存在则返回-1

lastIndexOf()

反向查询数组某个元素在数组中第一次出现的位置

存在该元素,返回下表,不存在则-1

forEach

遍历数组,每次循环中执行传入的回调函数

无返回值

map()

遍历数组,每次循环时执行传入的回调函数,根据回调函数的返回值,生成一个新的数组

有/自定义

filter()

筛选出满足条件的元素放到新数组中

满足条件的元素组成的新数组

every()

判断数组中所有的元素是否满足某个条件

全部满足返回true,只要有不满足的则返回false

some()

判断数组中是否存在,满足某个条件的元素

只要有一个满足则true,反之false

reduce()

每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值prev,传入到下一次函数中

最终操作的结果

reduceRight()

用法同reduce,只不过时从右向左

同reduce

includes()

判断一个数组是否包含一个指定的值

是返回true,否则false

arrary.from()

接收伪数组,返回对应的真数组

对应的真数组

find()

返回满足条件的第一个函数,不存在则返回undefined

满足条件第一个元素下标,不存在=>-1

fill()

用给定值填充一个数组

新数组

flat()

用于将嵌套的数组拉平,变成一堆的数组

返回一个新数组

flatMap()

flat()和map()的组合版,先通过map()返回一个新数组,再将数组拉平

返回新数组

var arr = [1, 2, "c"];
    var rel = arr.push("A", "B");
    console.log(arr); // [1, 2, "c", "A", "B"]
    console.log(rel); //  5  (数组长度)
    var arr = [1, 2, "c"];
    var rel = arr.unshift("A", "B");
    console.log(arr); // [ "A", "B",1, 2, "c"]
    console.log(rel); //  5  (数组长度)
    var arr = [1, 2, "c"];
    var rel = arr.pop();
    console.log(arr); // [1, 2]
    console.log(rel); // c
 var arr = [1, 2, 3, "a", "b", "c"];
    var rel = arr.reverse();
    console.log(arr); //    ["c", "b", "a", 3, 2, 1]
    console.log(rel); //    ["c", "b", "a", 3, 2, 1]
var arr = ["a","b", "c"];
    var rel = arr.shift();
    console.log(arr); // ['b', "c"]
    console.log(rel); // a
var arr1 = [10, 1, 5, 2, 3];
    arr1.sort();
    console.log(arr1);
//10,1,2,3,5,因为是根据unicode编码排序的所以不稳定
//重写sort方法
var arr = [10, 1, 5, 2, 3];
    arr.sort(function (a, b) {
      return a - b;
    });
    console.log(arr);
 //1,2,3,5,10
 var arr = ["a", "b", "c", 2, 3, 6];
    var rel = arr.splice(2, 1, "add1", "add2");
    console.log(arr);   //原数组
    //["a","b","add1","add2",2,3,6]
    console.log(rel);    //新数组 
    //["c"]
splice(index,howmany,item1,...,itemX)
//index:必须。整数,规定添加/删除项目的位置,可以用负数指定从结尾处起始
//howmany:必须,要删除的项目数量。如果设置为0,则不会删除项目
//item1...,item2:可选。向数组添加的新项目
    var arr1 = [1, 2, 3];
    var arr2 = ["a", "b", "c"];
    var arr3 = ["A", "B", "C"];
    var rel = arr1.concat(arr2, arr3);
    console.log(arr1); //原数组
    //[1,2,3]
    console.log(rel); //新数组
    //[1,2,3,"a","b","c","A","B","C"]
  var list = ["a", "b", "c", "d"]; 
    var result = list.join("-");     //"a-b-c-d"
    var result = list.join("/");     //"a/b/c/d"
    var result = list.join("");      //"abcd"
    var result = list.join();        //  a,b,c,d  
  var list = ["a", "b", "c", "d"];
    var result = list.slice(1, 3);
    console.log(result);  // ["b", "c"]
    //startIndex:起始下标,默认0
    //endIndex:终止下标 默认值length,可以接收负数
 var list = ["a", "b", "c", "d"];
    var rel = list.toString();
    console.log(rel);   // a,b,c,d   (字符串类型)
    //直接将数组转换为字符串,并且返回转换后的新数组,不改变原数组,与join();方法不添加任何参数 相同.
   var list = [1, 2, 3, 4];
    var rel = list.valueOf();
    console.log(list); // [1, 2, 3, 4]
    console.log(rel); // [1, 2, 3, 4]
    //返回数组的原始值(一般情况下其实就是数组自身)
 var list = [1, 2, 3, 4];
    var index = list.indexOf(4); //3
    var index = list.indexOf("4"); //-1
    console.log(index);
    //查询某个元素在数组中第一次出现的位置 存在该元素,返回下标,不存在 返回 -1 (可以通过返回值 变相的判断是否存在该元素)
var list = [1, 2, 3, 4];
    var index = list.lastIndexOf(4); //3
    var index = list.lastIndexOf("4"); //-1
    console.log(index);
    //查询某个元素在数组中最后一次出现的位置 (或者理解为反向查询第一次出现的位置) 存在该元素,返回下标,不存在 返回 -1 (可以通过返回值 变相的判断是否存在该元素)
var list = [32, 93, 77, 53, 38, 87];
    var res = list.forEach(function (item, index, array) {
      console.log(item, index, array);
    });
    console.log(res);
//遍历数组,每次循环中执行传入的回调函数 。(注意: forEach() 对于空数组是不会执行回调函数的。) 没有返回值,或理解为返回值为undefined,不改变原数组.
//item:每次循环的当前元素, index:当前项的索引, array:原始数组;数组中有几项,那么传递进去的匿名回调函数就需要执行几次;
var list = [32, 93, 77, 53, 38, 87];
var sum = 0;
list.forEach(function (item) {
  sum += item;
});
console.log(sum);
//380,计算总和的方法
    var list = [32, 93, 77, 53, 38, 87];
    var res = list.map(function (item, index, array) {
      return item + 5 * 2;
    });
    console.log("原数组", list);
    //[32, 93, 77, 53, 38, 87]
    console.log("新数组", res);
    //[42,103,87,63,48,97]
    //map中参数为(v,k)
//遍历数组, 每次循环时执行传入的回调函数,根据回调函数的返回值,生成一个新的数组 ,
//同forEach() 方法,但是map()方法有返回值,可以return出来;
   var list = [32, 93, 77, 53, 38, 87];
    var resList = list.filter(function (item, index, array) {
      return item >= 60; // true || false
    });
    console.log(resList);
    //[93,77,87]
//遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,把满足条件的元素筛选出来放到新数组中.
 var list = [32, 93, 77, 53, 38, 87];
    var result = list.every(function (item, index, array) {
      console.log(item, index, array);
      return item >= 50;
    });
    console.log(result);
    //flase
    //遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,全都满足返回true 只要有一个不满足 返回false => 判断数组中所有的元素是否满足某个条件
    var list = [32, 93, 77, 53, 38, 87];
    var result = list.some(function (item, index, array) {
      return item >= 50;
    });
    console.log(result);
    //true
    //遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,只要有一个元素满足条件就返回true,都不满足返回false => 判断数组中是否存在,满足某个条件的元素
    var arr = [2, 3, 4, 5];
    var sum = arr.reduce(function (prev, item, index, array) {
      return prev + item;
    });
    console.log(arr, sum);
    //[2,3,4,5],14
    //遍历数组, 每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值prev,传入到下一次函数中, 返回最终操作的结果;
    //reduce(callback,[initialValue])
    //callback (执行数组中每个值的函数,包含四个参数)
    //1、previousValue (上一次调用回调返回的值,或者是提供的初始值(initialValue))
    //2、currentValue (数组中当前被处理的元素)
    //3、index (当前元素在数组中的索引)
    //4、array (调用 reduce 的数组)
    //initialValue (作为第一次调用 callback 的第一个参数。)
let site = ['runoob', 'google', 'taobao'];
site.includes('runoob'); 
// true 
site.includes('baidu'); 
// false
//用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。
    var all = {
      0: "张飞",
      1: "28",
      2: "男",
      3: ["率土", "鸿图", "三战"],
      length: 4,
    };
    var list = Array.from(all);
    console.log(list, Array.isArray(list));
    ["张飞","28","男",array(3)]
//将一个类数组对象或者可遍历对象转换成一个真正的数组
    var list = [55, 66, 77, 88, 99, 100];
    var res= list.find(function (item, index, array) {
      return item > 60;
    });
    console.log(res); //66
//遍历数组 每次循环 执行回调函数,回调函数接受一个条件 返回满足条件的第一个元素,不存在则返回undefined
   var list = [55, 66, 77, 88, 99, 100];
    var index = list.findIndex(function (item, index, array) {
      console.log(item, index, array);
      return item > 60;
    });
    console.log(index); // 1
//遍历数组,执行回调函数,回调函数接受一个条件,返回满足条件的第一个元素下标,不存在则返回-
console.log(Array(100).fill(1).map((v,k)=>k+1).forEach(b=>a+=b))
//[1,2...,99,100]
//填充空数组,利用填充后的数组下标,达到生成100个数字
//finll(value,start,end)
//用给定值填充一个数组,将指定位置的元素全部替换为value
    var list = [1, 2, [3, 4, [5]]];
    var arr = list.flat(); // 默认拉平一次
    console.log("拉平一次", arr);
    //[1,2,3,4,array(1)]
    var arr = list.flat(2); // 拉平2次
    console.log("拉平两次", arr);
    //[1,2,3,4,5]
    //用于将嵌套的数组"拉平",变成一维的数组。该方法返回一个新数组,对原数据没有影响。
    var list = [55, 66, 77, 88, 99, 100];
    var newArr = list.map(function (item, index) {
      return [item, index];
    });
    console.log("Map方法:", newArr);
    //arrary(6):[55,0],[66,1],[77,2],[88,3],[99,4],[100,5]
    var newArr = list.flatMap(function (item, index) {
      return [item, index];
    });
    console.log("flatMap方法:", newArr);
    //[55,1,66,1,77,2,88,3,99,4,100,5]
    // flat()和map()的组合版 , 先通过map()返回一个新数组,再将数组拉平( 只能拉平一次 )
    //map返回的新数组中会带着原数组下标
function unique(arr) {
  let obj = {}
  //定义一个空对象
  let res = arr.filter(item => {
  if (obj.hasOwnProperty(typeof item + item)) {//obj.hasOwnProperty检测这个属性是否在该对象中
      //
    return false
  } else {//如果不在该对象中则在该对象中创建一个这样的属性,以便下次遇见相同的值,就可以跳过
    obj[typeof item + item] = true
    return true
  }
})
  return res
}
 var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0,'a', 'a',{},{}];
 console.log(unique(arr))
本篇博客就结束了,如果觉得此篇文章对你有帮助的话,就给一个小小的赞👍,谢谢。
感谢看到此处,我们下篇文章再见。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值