沉迷学习，无法自拔，
目录
12 、 arr.filter 过滤数组 要用return返回出来
21 、valueOf(); 返回数组的原始值（一般情况下其实就是数组自身）
获取数组最后一项
let arr = ['a', 'b', 'c'];
console.log(arr.length); //3
// 因为下标是从零开始，减一正好是最后一项（3-1=2）下标0、1、2，以此类推...
console.log(arr[arr.length - 1]) //c
先来几个随机数，开始热身 ♥♥♥
从数组中随机取出来一个值（文字）
var arr = ["被表白", "你爱的人也喜欢你","好运连连", "遍地桃花", "开心", "升职",
"防dao", "加薪", "健康", "出名", "暴富", "瘦成闪电"
];
var aa = Math.floor((Math.random() * arr.length));
// console.log(aa); //直接打印是下标
console.log(arr[aa]); //这样是文字，因为aa是变量所以[]
开始
Math.random(); 结果为0-1间的一个随机数(包括0,不包括1) 。
Math.round(num); 参数num为一个数值，函数结果为num四舍五入后的整数。
Math.ceil(n); Math.floor() 向上取整和向下取整。 (ceil有天花板的意思,向上;floor是地板的意思,向下)
因此可以用以上函数配合实现取1-6的随机数：
1，用Math.ceil(Math.random()*6);时，主要获取1到6的随机整数，取0的几率极小。
2，用Math.round(Math.random()*5 + 1)，可基本均衡获取1到6的随机整数，其中获取最小值0和最大值6的几率少一半。
3，用Math.floor(Math.random()*6 + 1);时，可均衡获取1到6的随机整数。
1 Math.ceil() 、 Math.floor() 、向上取整和向下取整。 (ceil有天花板的意思,向上;floor是地板的意思,向下)
console.log(Math.ceil(8.11));//9
console.log(Math.floor(8.11));//8
2 Math.round() 四舍五入。 （注意：正数时，包含5是向上取整，负数时 ，包含5是向下取整（因为负数时往下取更大）。）
console.log(Math.round(-8.3)); //-8
console.log(Math.round(-8.5)); //-8
console.log(Math.round(-8.51)); //-9
3 随机数 （包头不包尾）
//随机数 （包头不包尾）
console.log(parseInt(Math.random() * 10)); //未包含10 [0,10]
console.log(parseInt(Math.random() * (10 + 1))); //包含10 [0,11]
4 Math.abs() 获取绝对值
console.log(Math.abs(~8.24512)); //9
console.log(Math.abs(9 > 8)); //1
console.log(Math.abs(9 == 8)); //0
5、 Math.max() 、 Max.min()、 获取一组数据中的最大值和最小值
console.log(Math.max(10, 15, 9, 1010, 2002, 45, 78)); // 2002
console.log(Math.min(10, 1, 59, 1000, 200, 45, 78)); // 1
6，Math.PI 获取圆周率π 的值
console.log(Math.PI); //3.141592653589793
置顶 vue的结合js数组方法
1
<div v-for="(item, index) in list" :key="index" @click="chose(index)"></div>
chose(index){
this.list.unshift(...this.list.splice(index,1));//将删除的那个元素添加到最前
}
2
//map和forEach的区别，map是映射，有返回值
let data = ['cat', 'pig', 'dog'];
data.map((item, index) => {
//dog
if (index == 2) {
//要加[0],添加成数组第一个,
data.unshift(data.splice(index, 1)[0]); // ['dog', 'cat', 'pig']
// 不加[0] 是这样
// data.unshift(data.splice(index, 1));//[Array(1), 'dog', 'cat']
}
})
console.log(data) // ['dog', 'cat', 'pig']
data.unshift(data.splice(index, 1)[0]);
data.unshift(data.splice(index, 1))
map ？ 映射 ？不太懂
- 映射：你去照镜子，镜子里的你就是映射，是不是通俗易懂？就是副本
javaScript常用数组方法
整理了好久感觉还是表格清晰，
| 序号 | 方法名 | 功能 | 返回值 | 是否会 改变 原数 组 | 版本 |
|---|---|---|---|---|---|
| 1 | push() | (在结尾)向数组添加一或多个元素 | 返回新数组长度 | Y | ES5 |
| 2 | unshift() | （在开头)向数组添加一或多个元素 | 返回新数组长度 | Y | ES5 |
| 3 | pop() | 删除数组的最后一位 | 返回被删除的数据 | Y | ES5 |
| 4 | shift() | 删除数组的第一项 | 返回被删除的数据 | Y | ES5 |
| 5 | reverse() | 反转数组中的元素 | 返回反转后数组 | Y | ES5 |
| 6 | sort() | 排序 | 返回排序后的新数组 | Y | ES5 |
| 7 | splice() | 删除现有元素和/或添加新元素来更改数组的内容。原来的数组：改变 | 返回删除的数据 | Y | ES5 |
| 8 | slice() | 裁切指定位置的数组 原来的数组：不改变 | 被裁切的元素形成的新数组 | N | ES5 |
| 9 | join() | 数组转字符串 | 返回拼接后的新数组 | N | ES5 |
| 9.1 | arr.split() | 字符串转数组 | 返回拼接后的新数组 | ES5 | |
| 10 | concat() | 数组连接（合并） | 返回合并之后的数组 | N | ES5 |
| 11 | toString() | 将数组转换为字符串 | 新数组 | N | ES5 |
| 12 | valueOf() | 查询数组原始值 | 数组的原始值 | N | ES5 |
| 13 | indexOf() | 查询某个元素在数组中第一次出现的位置 | 存在该元素,返回下标,不存在 返回 -1 | N | ES5 |
| 14 | lastIdexOf() | 反向查询数组某个元素在数组中第一次出现的位置 | 存在该元素,返回下标,不存在 返回 -1 | N | ES5 |
| 15 | forEach() | (迭代) 遍历数组,每次循环中执行传入的回调函数 | 无/(undefined) | N | ES5 |
| 16 | map() | (迭代) 遍历数组, 每次循环时执行传入的回调函数,根据回调函数的返回值,生成一个新的数组 | 有/自定义 | N | ES5 |
| 17 | filter() | 过滤数组 | 满足条件的元素组成的新数组 | N | ES5 |
| 18 | every() | (迭代) 判断数组中所有的元素是否满足某个条件 | 全部满足返回true，只要有一个不满足就返回false | N | ES5 |
| 19 | some() | (迭代) 判断数组中是否存在,满足某个条件的元素 | 只要有一个元素满足条件就返回true,都不满足返回false | N | ES5- |
| 20 | reduce() | (归并)遍历数组, 每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值prev,传入到下一次函数中，我一般用于计算价格 购物车全选 反选 | 最终操作的结果 | N | ES5- |
| 21 | reduceRight() | (归并)用法同reduce,只不过是从右向左 | 同reduce | ES5 | |
| 22 | includes() | 判断一个数组是否包含一个指定的值. | 是返回 true，否则false | N | ES6 |
| 23 | Array.from() | 接收伪数组,返回对应的真数组，我一般用于去重Array.from(new Set（arr）) | 对应的真数组 | N | ES6 |
| 24 | find() | 返回满足条件的第一个元素,不存在返回undefined | 满足条件第一个元素/否则返回undefined | N | ES6 |
| 25 | findIndex() | 返回满足条件的第一个元素下标,不存在返回-1 | 满足条件第一个元素下标,不存在返回-1 | N | ES6 |
| 26 | fill() | 用给定值填充一个数组 | 新数组 | N | ES6 |
| 27 | flat() | 用于将嵌套的数组“拉平”，变成一维的数组。 | 返回一个新数组 | N | ES6 |
| 29 | 666 | 666 | 666 | 666 | 更新中。。 |
1 数组长度
- 中括号里的中括号算一个
let arr = [1, 2, 3, [4, 5]];
console.log(arr.length); //4
2 split 字符串转数组
- 语法：split('字符串的分隔符')
var str = '啊,吧,c' //字符串
var arr66 = str.split(",") //字符串转数组方法括号里面是 分隔符
console.log(arr66); //数组
3 join 数组转字符串
- 语法：数组名.join(“要拼接的符号”)
let arr1 = [1, 2, 3, 4, 5, 6];
console.log(arr1.join("-")); //1-2-3-4-5-6
4 push末尾追加
- 语法：数组名.push()数组末尾追加 返回的是追加后数组元素长度个数
let arr2 = ["a", "b", "c", "d"];
console.log(arr2.push("e", "f")); //6
5、unshift头部添加
- 语法：arr.unshift()数组头部追加 返回的是追加后数组元素个数
let arr4 = ["a", "b", "c", "d"];
console.log(arr4.unshift("aa")); //5
6 、pop 末尾删除
- 语法：arr.pop()数组末尾删除 ，返回值是被删除的元素
let arr3 = ["a", "b", "c", "d"];
console.log(arr3.pop()); //d
7、shift头部删除
- 语法：shift()数组头部删除 返回值是被删除的元素
let arr5 = ["a", "b", "c", "d"];
console.log(arr5.shift()); //a
8 、sort排序
- 语法：sort()数组排序 要用return返回出来
let arr6 = [1, 59, 6, 9, 2, 4];
//1,2,4,6,9,59 箭头函数可以省略return只有一行语句时 a-b升序 b-a倒叙
console.log(arr6.sort((a, b) => a - b));
// 上面是简写
//完整写法如下
arr6.sort((c, d) => { //降序
return d - c
});
console.log(arr6);
9 、reverse()数组反转
let arr7 = ["a", "b", "c", "d"];
console.log(arr7.reverse()); //d c b a
//数组方法可以串联例如, 也可以在data中定义,
//在vue中复杂过重的模板建议写在computed中
computed: {
xx.split('').reverse().join('')
},
10 、slice数组删除（不改变原数组）
- slice()数组删除或组成新数组 传一个参数是删除几个，两个参数是从开始下标到结束下标之间组成新数组包头不包尾,特点不会改变原数组
let arr8 = ["a", "b", "c", "d", "e", "f"];
console.log(arr8.slice(3)); //d e f 一个参数是删除几个
//b c d 两个参数是从开始下标到结束下标之间组成新数组包头不包尾
//括号里默认不写就是从头到尾
console.log(arr8.slice(1, 4));
console.log(arr8); //(6) ['a', 'b', 'c', 'd', 'e', 'f'] 特点不会改变原数组
11 、splice 数组删除（会改变原数组）
// arr.splice(从下标那个位置删除，删除几个元素包含当前元素)
// 会改变原数组
var arr = ['a', 'b', 'c', 'd']
arr.splice(1, 2) //删除 b c
console.log(arr); //打印 a d
12 、 arr.filter 过滤数组 要用return返回出来
let arr10 = [1, 2, 4, 5, 6, 7, 8, 9]
let arr11 = arr10.filter(item => {
return item > 5
});
console.log(arr11); // 6 7 8 9
13 、forEach() 数组遍历
- forEach() 数组遍历 可以传三个参 item index array (每一项，下标，原数组)
let arr12 = [1, 2, 3, 4, 5, 6, 7, 8, 9]; arr12.forEach((item, index, array) => { console.log(item); //每一项 console.log(index); //0 1 2 3 4 5 6 7 8 下标 console.log(array); //9个数组，每一数组有1 2 3 4 5 6 7 8 9 })
14 、set 去重
var arr14 = [1, 2, 1, 2, 3];
console.log(new Set(arr14)); // 1 2 3
15、 将数组中的字符串拿出来 取出来一种类型
- 数组中多种类型，将某一类取出来
let arr15 = [1, 2, 3, 4, 5, 'a', 'b', 'c'];
let newArr1 = [];
for (i = 0; i < arr15.length; i++) {
// 不是必要循环的内容不要放在for里 定义的新数组不要放在for循环里
// var newArr1 = []; 错误 定义
if (typeof arr15[i] == "string") {
newArr1.push(arr15[i])
}
};
console.log(newArr1); // 'a' 'b' 'c'
16、 去空
let arr16 = [1, 2, , , 3];
let newArr2 = [];
for (i = 0; i < arr16.length; i++) {
//空就是undefined 所以将不是空的拿出来，逆向思维
if (typeof arr16[i] != "undefined") {
newArr2.push(arr16[i]) //不等于空追加到新数组
}
};
console.log(arr16); //[1, 2, empty × 2, 3]
console.log(newArr2); // 1 2 3
17、xx.concat(n，n) 合并数组
var arr1 = [1, 2, 3];
var arr2 = ["a", "b", "c"];
var arr3 = ["A", "B", "C"];
var rel = arr1.concat(arr2, arr3);
console.log(arr1); //原数组
console.log(rel); //新数组
18 、数组转字符串 (默认",")
- 语法：数组名.join(“要拼接的符号”)
var list = ["a", "b", "c", "d"]; // "a-b-c-d"
var result = list.join("-"); //"a-b-c-d"
var result1 = list.join("/"); //"a/b/c/d"
var result2 = list.join(""); //"abcd"
var result3 = list.join(); // a,b,c,d 默认不写就是逗号
console.log(result,result1 ,result2 ,result3 );
20 、arr.toString() 强制转字符串
var list = ["a", "b", "c", "d"];
var rel = list.toString();
console.log(rel); // a,b,c,d (字符串类型)
21 、valueOf(); 返回数组的原始值（一般情况下其实就是数组自身）
var list = [1, 2, 3, 4];
var rel = list.valueOf();
console.log(list); // [1, 2, 3, 4]
console.log(rel); // [1, 2, 3, 4]
22 、arr.indexOf();
- 查询某个元素在数组中第一次出现的位置 存在该元素,返回下标,不存在 返回 -1
var list = [1, 2, 3, 4];
var index = list.indexOf(4); //3
var index = list.indexOf("4"); //-1
console.log(index);
23 、arr.map()
- map 的速度大于forEach。
- map会返回一个新的数组，不会改变原来的数组，forEach不会返回新数组，会改变原数组
var list = [32, 93, 77, 53, 38, 87];
var res = list.map(function (item, index, array) {
return item + 10;
});
console.log("原数组", list);
console.log("新数组", res);
24 arr.find();
- 返回满足条件的第一个元素,不存在则返回undefined参数
var list = [505, 686, 77, 48, 99, 100];
var index = list.find(function(item, index, array) {
console.log(item, index, array);
return item > 800;
});
console.log(index); //undefined 找到返回元素，找不到返回undefined
25 、arr.fill 数组填充
- 语法：arr.fill('要填充的值'，从下标哪里开始，到下标那里结束)
var result = ["a", "b", "c"]
var rel = result.fill("填充", 0, 2);
console.log(rel);
26、 arr.flat(num/Infinity);
- 用于将嵌套的数组"拉平",变成一维的数组。该方法返回一个新数组，对原数据没有影响。
- 注意 默认拉平一次 如果想自定义拉平此处 需要手动传参 ,如果想全都拉平 传 Infinity
var list = [1, 2, [3, 4, [5], 6, [7, 8, [66, 77]]]];
var arr = list.flat(); // 默认拉平一次
console.log("拉平一次", arr);
var arr = list.flat(2); // 拉平2次
console.log("拉平两次", arr);
// 小括号里写几拉平几次，infinity全部拉平
var arr = list.flat(Infinity); // 拉平2次
console.log("全部拉平", arr);
更新中。。。
