JS中常用的方法

Posted 2021-03-02 猫一只咪

Array

new Set（）

用来对数组进行去重。

var arr = [1,2,3,3,4,5,5,5];

console.log(new Set(arr));//{1, 2, 3, 4, 5}

const a = Array.from(new Set(arr));console.log(a);//[1, 2, 3, 4, 5]

sort（）

对数组元素进行排序（改变原数组）

var aa = [1,3,4,2,5,7,9,6];console.log(aa.sort());//[1, 2, 3, 4, 5, 6, 7, 9]

reverse（）

反转数组中的元素（改变原数组）。

var aa = [1,3,4,2,5,7,9,6];console.log(aa.reverse());// [9, 7, 6, 5, 4, 3, 2, 1]

delete

删除一个数组成员，会形成空位，并不会影响length属性（改变原数组）,同样适用于对象。

var aa = [1,3,4,2,5,7,9,6];delete aa[0]; console.log(aa); // [empty, 3, 4, 2, 5, 7, 9, 6]

aa.length //8

const obj = {name: ‘pboebe‘,age: ‘23‘,sex: ‘女‘};delete obj.sex;console.log(obj);//{name: "pboebe", age: "23"}

shift（）

把数组的第一个元素从其中删除，并返回第一个元素的值（改变原数组）。

var aa = [1,3,4,2,5,7,9,6]; aa.shift()// 1; console.log(aa); //[3, 4, 2, 5, 7, 9, 6]

unshift（）

向数组的起始处添加一个或多个元素,并返回新的长度（改变原数组）。

push（）

在数组的末端添加一个或多个元素，并返回添加新元素后的数组长度（改变原数组）。

valueOf（）

返回数组本身。

toString（）

可把值转换成字符串。

var aa= [3,4,4,5,4,6,5,7];
console.log(aa.toString());//3,4,4,5,4,6,5,7

concat（）

在原始数据尾部添加另外数据组成新数据（字符串适用）。

var aa1 = [3,4,5],aa2 = [6,7]; console.log(aa1.concat(aa2));//[3, 4, 5, 6, 7]

const x = ‘abc‘;const y = ‘def‘;const z = x.concat(y);console.log(y);//"abcdef"

join（）

以参数作为分隔符，将所有参数组成一个字符串返回（一般默认逗号隔开）。

const arr = [3,4,4,5,4,6,5,7];console.log(arr.join(‘-‘)); // 3-4-4-5-4-6-5-7

slice（start, end）

用于提取原来数组的一部分，会返回一个提取的新数组，原数组不变（字符串适用,不包括end)。

const arr = [3,4,4,5,4,6,5,7];

const a = arr.slice(2, 5);console.log(a);//[4, 5, 4]

const x = ‘abcdefgh‘;const y = x.slice(3, 6);console.log(y);//def

splice（）

用于删除原数组的一部分，并且可以在删除的位置添加新的数组成员，返回值是被删除的数组元素。（改变原数组）

splice（t, v, s）t:被删除元素的起始位置；v：被删除元素个数；s:s以及后面的元素为被插入的新元素。

const arr = [3,4,4,5,4,6,5,7];
const a = arr.splice(3, 2, 12); // [5, 4]
console.log(arr);// [3, 4, 4, 12, 6, 5, 7]

map（）

依次遍历数组成员，根据遍历结果返回一个新数组。（map方法同样适用于字符串，但是不能直接调用，需要通过函数的call方法，间接使用，或者先将字符串川转为数组，再使用）（不会改变原始数组）。

const arr = [3,4,4,5,4,6,5,7];arr.map(item => item*2); //[6, 8, 8, 24, 12, 10, 14]

forEach（）

跟map方法类似，遍历数组，区别是无返回值。

const arr3 = [3,4,4,5,4,6,5,7];arr3.forEach(item => {item=item*2;console.log(item);}) //6 8 8 10 8 12 10 14

for in（）

跟map方法类似，遍历对象或者数组。

但值得注意的是for in循环返回的值都是数据结构的键值名。 遍历对象返回的对象的key值,遍历数组返回的数组的下标(key)。

对象：const obj1 = {a: 123, b: 12, c: 2 };for(objitem in obj1){console.log(objitem+‘:‘+obj1[objitem])} //a:123  b:12  c:2

数组：

const arr = [3,4,4,5];
for(let a in arr) {
console.log(a+‘:‘+arr[a])
}//0:3 1:4 2:4 3:5

filter（）

一个过滤方法，参数是一个函数，所有的数组成员依次执行该函数，返回结果为true的成员组成一个新数组返回。（不会改变原始数组）。

const arr8 = [3,4,4,5,4,6,5,7];
const a = arr8.filter(item => item % 3 > 1);
console.log(a);//[5, 5]

some（）& every（）

这两个方法类似于“断言”（assert），用来判断数组成员是否符合某种条件。

some方法是只要有一个数组成员的返回值为true，则返回true，否则false；

every方法是需要每一个返回值为true，才能返回true，否则为false;

const arr10 = [3,4,4,5,4,6,5,7];

arr10.some(function(item,index,arr){console.log(‘item:‘+item+‘,index:‘+index+‘,arr:‘+arr);return item >3;})

//item:3,index:0,arr:3,4,4,5,4,6,5,7

//item:4,index:1,arr:3,4,4,5,4,6,5,7

//true

arr10.every(function(item,index,arr){console.log(‘item:‘+item+‘,index:‘+index+‘,arr:‘+arr);return item >3;})

//item:3,index:0,arr:3,4,4,5,4,6,5,7

//false

reduce（）

依次处理数组的每个成员，最终累计成一个值。

格式：

reduce（a, b, x, y）

a:必填，累计变量；b：必填，当前变量；x: 可选，当前位置； y:可选，原数组。

const arr = [3,4,4,5,4,6,5,7];

方法1:const b = arr.reduce((p,v)=>{return p+v}); //38

方法2:const a = arr.reduce((pre, cur) => (sum= pre+cur, sum));console.log(a);

//高级用法（举个数组去重和数组扁平化栗子）
const b = arr.reduce((pre, cur) => {
    if(!pre.includes(cur)) {
        return pre.concat(cur)
    } else {
        return pre
    }
}, [])
// [3, 4, 5, 6, 7]
 
const arrs = [[2,3,2], [3,4,5]]
const c = arr.reduce((pre, cur) => {
    return pre.concat(cur)
}, [])
// [3, 4, 4, 5, 4, 6, 5, 7]

reduceRight（）

与reduce方法使用方式相同，区别在于reduceRight方法从右到左执行（例子略过）

indexOf（）

返回给定元素在数组中的第一次出现的位置，如果没有则返回-1(同样适用于字符串)。

lastIndexOf（）

返回给定元素在数组中最后一次出现的位置，没有返回-1(同样适用于字符串)。

groupBy（）

把集合的元素按照key归类，key由传入的参数返回。

const arr = [
                {name: ‘小孙‘, age: 18, score: 60, weight: 60},
                {name: ‘小王‘, age: 19, score: 70, weight: 55},
                {name: ‘小李‘, age: 18, score: 60, weight: 70},
                {name: ‘小刘‘, age: 20, score: 70, weight: 65},
                {name: ‘小赵‘, age: 18, score: 60, weight: 60},
                {name: ‘小钱‘, age: 19, score: 70, weight: 55},
                {name: ‘小周‘, age: 20, score: 60, weight: 50},
        ];
const example = (data, key) => {
            return data.reduce(function(prev, cur) {
                (prev[cur[key]] = prev[cur[key]] || []).push(cur);
                return prev;
            }, {});
        };
console.log(example(arr, ‘age‘));
 
// object: {18: Array(3), 19: Array(2), 20: Array(2)}
  18: Array(3)
    0: {name: "小孙", age: 18, score: 60, weight: 60}
    1: {name: "小李", age: 18, score: 60, weight: 70}
    2: {name: "小赵", age: 18, score: 60, weight: 60}
  19: Array(2)
    0: {name: "小王", age: 19, score: 70, weight: 55}
    1: {name: "小钱", age: 19, score: 70, weight: 55}
  20: Array(2)
    0: {name: "小刘", age: 20, score: 70, weight: 65}
    1: {name: "小周", age: 20, score: 60, weight: 50}
 

shuffle（）

用洗牌算法随机打乱一个集合。

const arr = [1,2,3,4,5,6,7,8,9,10];
const shuffle = ([...arr]) => {
  let m = arr.length;
  while (m) {
    const i = Math.floor(Math.random() * m--);
    [arr[m], arr[i]] = [arr[i], arr[m]];
  }
  return arr;
};
console.log(shuffle(arr))
// [10, 9, 7, 5, 6, 4, 1, 2, 8, 3]

flatten（）

简写为flat（），接收一个数组，无论这个数组里嵌套了多少个数组，flatten最后都会把其变成一个一维数组(扁平化)。

const arr = [[1,2,3],[4,5,[6,7]]];
const a = arr.flat(3);
console.log(a);// [1, 2, 3, 4, 5, 6, 7]

Array.isArray（）

用来判断是不是数据是不是一个数组，返回值为true或false。

const arr = [3,4,4,5,4,6,5,7];
console.log(Array.isArray(arr))//true