数组

74 阅读8分钟

关于数组

下面前三种是对原数组产生影响的增添方法,第四种则不会对原数组产生影响

  • push()
  • unshift()
  • splice()
  • concat()

push()

push()方法接收任意数量的参数,并将它们添加到数组末尾,返回数组的最新长度

let colors = []; // 创建一个数组
let count = colors.push("red", "green"); // 推入两项
console.log(count) // 2

unshift()

unshift()在数组开头添加任意多个值,然后返回新的数组长度

let colors = new Array(); // 创建一个数组
let count = colors.unshift("red", "green"); // 从数组开头推入两项
alert(count); // 2

splice

传入三个参数,分别是开始位置、0(要删除的元素数量)、插入的元素,返回空数组

let colors = ["red", "green", "blue"];
let removed = colors.splice(1, 0, "yellow", "orange")
console.log(colors) // red,yellow,orange,green,blue
console.log(removed) // []

concat()

首先会创建一个当前数组的副本,然后再把它的参数添加到副本末尾,最后返回这个新构建的数组,不会影响原始数组

let colors = ["red", "green", "blue"];
let colors2 = colors.concat("yellow", ["black", "brown"]);
console.log(colors); // ["red", "green","blue"]
console.log(colors2); // ["red", "green", "blue", "yellow", "black", "brown"]

下面三种都会影响原数组,最后一项不影响原数组:

  • pop()
  • shift()
  • splice()
  • slice()

pop()

pop() 方法用于删除数组的最后一项,同时减少数组的 length 值,返回被删除的项

let colors = ["red", "green"]
let item = colors.pop(); // 取得最后一项
console.log(item) // green
console.log(colors.length) // 1

shift()

shift()方法用于删除数组的第一项,同时减少数组的 length 值,返回被删除的项

let colors = ["red", "green"]
let item = colors.shift(); // 取得第一项
console.log(item) // red
console.log(colors.length) // 1

splice()

传入两个参数,分别是开始位置,删除元素的数量,返回包含删除元素的数组

let colors = ["red", "green", "blue"];
let removed = colors.splice(0,1); // 删除第一项
console.log(colors); // green,blue
console.log(removed); // red,只有一个元素的数组

slice()

slice() 用于创建一个包含原有数组中一个或多个元素的新数组,不会影响原始数组

let colors = ["red", "green", "blue", "yellow", "purple"];
let colors2 = colors.slice(1);
let colors3 = colors.slice(1, 4);
console.log(colors)   // red,green,blue,yellow,purple
concole.log(colors2); // green,blue,yellow,purple
concole.log(colors3); // green,blue,yellow

即修改原来数组的内容,常用splice

splice()

传入三个参数,分别是开始位置,要删除元素的数量,要插入的任意多个元素,返回删除元素的数组,对原数组产生影响

let colors = ["red", "green", "blue"];
let removed = colors.splice(1, 1, "red", "purple"); // 插入两个值,删除一个元素
console.log(colors); // red,red,purple,blue
console.log(removed); // green,只有一个元素的数组

即查找元素,返回元素坐标或者元素值

  • indexOf()
  • includes()
  • find()

indexOf()

返回要查找的元素在数组中的位置,如果没找到则返回 -1

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
numbers.indexOf(4) // 3

includes()

返回要查找的元素在数组中的位置,找到返回true,否则false

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
numbers.includes(4) // true

find()

返回第一个匹配的元素

const people = [
    {
        name: "Matt",
        age: 27
    },
    {
        name: "Nicholas",
        age: 29
    }
];
people.find((element, index, array) => element.age < 28) // // {name: "Matt", age: 27}

二、排序方法

数组有两个方法可以用来对元素重新排序:

  • reverse()
  • sort()

reverse()

顾名思义,将数组元素方向反转

let values = [1, 2, 3, 4, 5];
values.reverse();
alert(values); // 5,4,3,2,1

sort()

sort()方法接受一个比较函数,用于判断哪个值应该排在前面

function compare(value1, value2) {
    if (value1 < value2) {
        return -1;
    } else if (value1 > value2) {
        return 1;
    } else {
        return 0;
    }
}
let values = [0, 1, 5, 10, 15];
values.sort(compare);
alert(values); // 0,1,5,10,15

三、转换方法

常见的转换方法有:

join()

join() 方法接收一个参数,即字符串分隔符,返回包含所有项的字符串

let colors = ["red", "green", "blue"];
alert(colors.join(",")); // red,green,blue
alert(colors.join("||")); // red||green||blue

四、迭代方法 遍历

常用来迭代数组的方法(都不改变原数组)有如下:

  • some()
  • every()
  • forEach()
  • filter()
  • map()

some()

对数组每一项都运行传入的测试函数,如果至少有1个元素返回 true ,则这个方法返回 true

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
let someResult = numbers.some((item, index, array) => item > 2);
console.log(someResult) // true

every()

对数组每一项都运行传入的测试函数,如果所有元素都返回 true ,则这个方法返回 true

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
let everyResult = numbers.every((item, index, array) => item > 2);
console.log(everyResult) // false

forEach()

对数组每一项都运行传入的函数,没有返回值

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
numbers.forEach((item, index, array) => {
    // 执行某些操作
});

filter()

对数组每一项都运行传入的函数,函数返回 true 的项会组成数组之后返回

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
let filterResult = numbers.filter((item, index, array) => item > 2);
console.log(filterResult); // 3,4,5,4,3

map()

对数组每一项都运行传入的函数,返回由每次函数调用的结果构成的数组

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
let mapResult = numbers.map((item, index, array) => item * 2);
console.log(mapResult) // 2,4,6,8,10,8,6,4,2

1、 Object.is()

Object.is() 是一种判断两个值是否相同的方法。

语法:Object.is(要比较的第一个值, 要比较的第二个值);

返回值:一个布尔表达式,指示两个参数是否具有相同的值。

例子:

// Case 1: Evaluation result is the same as using '==='
Object.is(25, 25);                // true
Object.is('foo', 'bar');          // false
Object.is(foo, foo);              // true
// Case 2: Signed zero
Object.is(0, -0);                 // false
Object.is(0n, -0n);               // true
// Case 3: NaN
Object.is(NaN, 0/0);              // true
Object.is(NaN, Number.NaN)        // true



// -----------------------------------------------------------------



2Object.assign()

Object.assign() 方法用于将所有可枚举的自身属性从一个或多个源对象复制到目标对象。

语法:Object.assign(target, ...sources)

参数:

target:目标对象——应用源属性的对象,修改后返回。

sources:源对象——包含你要应用的属性的对象。

返回值:修改后的目标对象。

例子:

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };
const returnedTarget = Object.assign(target, source);
console.log(target);
// expected output: Object { a: 1, b: 4, c: 5 }
console.log(returnedTarget);
// expected output: Object { a: 1, b: 4, c: 5 }
注意:如果源对象中的属性具有相同的键,则目标对象中的属性会被源中的属性覆盖。较晚来源的属性会覆盖较早来源的属性。



// -----------------------------------------------------------------




3Object.entries()

Object.entries() 方法返回给定对象自己的可枚举字符串键属性 [key, value] 对的数组。

它类似于使用 for...in 循环进行迭代,除了 for...in 循环还会枚举原型链中的属性。属性的顺序与通过手动循环对象的属性值给出的顺序相同。

语法:Object.entries(obj)

参数:

obj:要返回其自己的可枚举字符串键属性 [key, value] 对的对象。

返回值:给定对象自己的可枚举字符串键属性 [key, value] 对的数组。

例子:

const object1 = {name: "David", age: 23};
for (const [key, value] of Object.entries(object1)) {
  console.log(`${key}: ${value}`);
}
// "name: David"
// "age: 23"



// -----------------------------------------------------------------




4Object.values()

Object.values() 方法返回给定对象自己的可枚举属性值的数组,其顺序与 for...in 循环提供的顺序相同。

语法:Object.values(obj)

参数:

obj:要返回其可枚举自身属性值的对象。

返回值:包含给定对象自己的可枚举属性值的数组。

例子:

const object1 = {
  a: 'somestring',
  b: 42,
  c: false
};
console.log(Object.values(object1));
// expected output: Array ["somestring", 42, false]



// -----------------------------------------------------------------



5Object.prototype.hasOwnProperty()

hasOwnProperty() 方法返回一个布尔值,指示对象是否具有指定的属性作为它自己的属性。

如果指定的属性是对象的直接属性,则该方法返回 true — 即使值为 null 或未定义。如果该属性是继承的或根本没有声明,则返回 false。

语法:hasOwnProperty(prop)

参数

prop:要测试的属性的字符串名称或符号。

返回值:如果对象将指定的属性作为自己的属性,则返回true;否则为false。

例子:

const object1 = {};
object1.property1 = 42;
console.log(object1.hasOwnProperty('property1'));
// expected output: true
console.log(object1.hasOwnProperty('toString'));
// expected output: false
console.log(object1.hasOwnProperty('hasOwnProperty'));
// expected output: false


// -----------------------------------------------------------------



6Object.keys()

Object.keys() 方法用于返回给定对象自己的可枚举属性名称的数组,以与普通循环相同的顺序迭代。

语法:Object.keys(obj)

参数:

obj:要返回可枚举自身属性的对象。

返回值:表示给定对象的所有可枚举属性的字符串数组。

例子:

const object1 = {
  a: 'somestring',
  b: 42,
  c: false
};
console.log(Object.keys(object1));
// expected output: Array ["a", "b", "c"]


// -----------------------------------------------------------------




7Object.prototype.toString()

toString() 方法返回一个表示对象的字符串。当对象将被表示为文本值或以期望字符串的方式引用对象时,将自动调用此方法 id。默认情况下,toString() 方法由从 Object 继承的每个对象继承。

语法:toString()

返回值:表示对象的字符串。

例子:

function Dog(name) {
  this.name = name;
}
const dog1 = new Dog('Gabby');
Dog.prototype.toString = function dogToString() {
  return `${this.name}`;
};
console.log(dog1.toString());
// expected output: "Gabby"
注意:对于 NumbersBig IntstoString() 采用可选参数 radix,其值必须最小为 2,最大为 36// -----------------------------------------------------------------



8Object.freeze()

Object.freeze() 方法冻结一个对象,这意味着它不能再被更改。冻结对象可防止向其添加新属性,防止删除现有属性,防止更改现有属性的可枚举性、可配置性或可写性,并防止更改现有属性的值。它还可以防止其原型被更改。

语法:Object.freeze(obj)

参数:

obj:要冻结的对象。

返回值:传递给函数的对象。

例子:

const obj = {
 prop: 42
};
Object.freeze(obj);
obj.prop = 33;
// Throws an error in strict mode
console.log(obj.prop);
// expected output: 42

1、join:将数组中所有的元素放入到一个字符串中,返回字符串。

let arr = ['hello','word']
console.log(arr.join(' ')) //结果为 hello word
console.log(arr) //结果为 ['hello','word']


------------------------------------------------------------



2、concat:连接多个数组,两边的数组的原始数据不会变,返回一个新的数组还可以继续concat。

let arr1 = ['a','b']
let arr2 = ['c','d']
let arr3 = arr1.concat(arr2) // [a,b,c,d]
console.log(arr3.concat(3,4)) //结果为 [a,b,c,d,3,4]
console.log(arr1) //结果为 ['a','b']
console.log(arr2) //结果为 ['c','d']


------------------------------------------------------------


3、slice:从开始到结束(左闭右开)选择数组的一部分浅拷贝到一个新的数组中。

let arr1 = ['a','b','c','d']
let arr2 = arr1.slice(0,2) //拷贝到的新的数组
console.log(arr2) //结果为 [a,b]
console.log(arr1) //结果为 ['a','b','c','d']


------------------------------------------------------------


4、map:(这个方法用的地方很多)创建一个新的数组并返回,新数组的每一
个元素都由原数组的每一个元素执行提供的函数提供而来,其中原来的数组不会发生变化。

let arr1 = [1,2,3,4]
let arr2 = arr1.map( item => {
	//item就是每一个元素 其中这个箭头函数可以有三个参数下面也相似 value index arr
	return item + 1 //相当于每个元素都加1
})
console.log(arr2) //map以后新的数组结果为 [2,3,4,5]
console.log(arr1) //原来的数组结果没有变为 [1,2,3,4]


------------------------------------------------------------


5、every:检测数组中所有元素是否都符合指定的条件。只要检测到一个元素不满足就返回false,只有都满足才返回truelet arr1  = [1,2,3,4]
let test1 = arr1.every( item => {
	//item就是每一个元素
	return item > 0  //判断条件
})
let test2 = arr1.every( item => {
	//item就是每一个元素
	return item > 1  //判断条件
})
console.log(test1) //true 所有的item数组元素都满足 
console.log(test2) //false 里面有一个item不满足 就是那个1
console.log(arr1)  //原来的数组结果没有变为 [1,2,3,4]


------------------------------------------------------------


6、filter:创建一个新的数组,新数组中的元素是那些筛选以后满足条件的元素。

let arr1  = [1,2,3,4]
let arr2 = arr1.filter( item => {
	//item就是每一个元素
	return item > 1  //筛选条件
})

console.log(arr2) // 筛选以后的数组数据 [2,3,4]
console.log(arr1)  //原来的数组结果没有变为 [1,2,3,4]



------------------------------------------------------------


7、forEach:用于调用数组的每一个元素,并将元素传递给回调函数,这个方法返回undefinedlet arr1  = [1,2,3,4]
let res   = []  //用来记录数据操作的
arr1.forEach( item => {
	//item就是每一个元素
	res.push( item * 2 ) //相当于把每一个数组元素都乘以2然后放到res这个数组中
})

console.log(res) // 利用循环遍历进行数据操作后的数组 [2,4,6,8]
console.log(arr1)  //原来的数组结果没有变为 [1,2,3,4]


---------------------------------------------------------

8、reduce:接收一个函数作为累加器,数组中每个值开始缩减,最终计算为一个值。

let arr1  = [1,2,3,4]

let res   = arr1.reduce( pre,cur => {
	//pre:前一个值  cur:当前的值
	return pre + cur  //相当于把第一项和第二项进行相加,依次迭代最后就剩下最后两个相加然后返回一个结果
})

console.log(res) // 相加以后的结果 10
console.log(arr1)  //原来的数组结果没有变为 [1,2,3,4]

原文链接:blog.csdn.net/qq_42292981…

Array.isArray(对象)---判断这个对象是不是数组,返回布尔值



var abc=['aa','bb','cc']
console.log(Array.isArray(abc)) //输出:true
concat(数组1,数组2,···)---拼接数组,返回一个新数组



var abc=['aa','bb','cc']
var def=['dd','ee','ff']
console.log(abc.concat(def)) //输出:['aa', 'bb', 'cc', 'dd', 'ee', 'ff']



push()---把值追加到数组的最后

var abc=['aa','bb','cc']
abc.push('de')
console.log(abc) //输出:['aa', 'bb', 'cc', 'de']



pop()---删除数组的最后一个元素,返回值是删除的这个值

var abc=['aa','bb','cc']
console.log(abc.pop()) //输出:cc



shift()---删除数组的第一个元素,返回值是删除的这个值

var abc=['aa','bb','cc']
console.log(abc.shift()) //输出:aa


unshift()---像数组的第一个元素前插入一个元素,返回值是插入的这个值

var abc=['aa','bb','cc']
abc.unshift('haha')
console.log(abc) //输出:['haha', 'aa', 'bb', 'cc']



every(函数)---返回值是布尔类型,函数作为参数使用(有三个参数,第一个参数是元素的值,
第二个参数是索引值,第三个参数是原来的数组),如果这个数组中每一个元素都符合条件才会返回truefilter(函数)---返回数组中符合条件的元素,组成一个新数组。

forEach(函数)---遍历数组

indexOf(值)---返回的是索引值,没有则返回-1

join(字符串)---返回一个字符串

map(函数)---数组中每个元素都要执行这个函数,把执行后的结果放到一个新数组

reverse()---反转数组

sort()---排序

slice(开始的索引,结束的索引)---截取的值放到一个新数组中(不包含结束位置)

splice(开始的位置,要删除的个数,替换的元素值)---一般用来删除数组中的元素,或替换,或插入。


原文链接:blog.csdn.net/weixin_4509…


  • Array.isArray(对象)---->判断这个对象是不是数组

    • instanceof关键字

    • .concat(数组,数组,数组,...) 组合一个新的数组

    • .every(函数)--返回值是布尔类型,函数作为参数使用,函数中有三个参数,第一个参数是元素的值,第二个参数是索引值,第三个参数是原来的数组(没用)

    • 如果这个数组中的每个元素的值都符合条件,最后才返回的是true

    • .filter(函数);返回的是数组中每一个元素都复合条件的元素,组成了一个新的数组

    • .push(值);--->把值追加到数组中,加到最后了---返回值也是追加数据之后的数组长度

    • .pop();--->删除数组中最后一个元素,返回值就是删除的这个值

    • .shift();--->删除数组中第一个元素,返回值就是删除的这个值

    • .unshift();--->向数组的第一个元素前面插入一个新的元素,----返回值是插入后的程度

    • .forEach(函数)方法---遍历数组用---相当于for循环

    • .indexOf(元素值);返回的是索引,没有则是-1

    • .join("字符串");----返回的是一个字符串

    • .map(函数);--->数组中的每个元素都要执行这个函数,把执行后的结果重新的全部的放在一个新的数组中

    • .reverse();----->反转数组

    • .sort();---排序的,可能不稳定,如果不稳定,请写MDN中的那个固定的代码

    • .arr.slice(开始的索引,结束的索引);把截取的数组的值放在一个新的数组中,但是不包含结束的索引对应的元素值

    • .splice(开始的位置,要删除的个数,替换的元素的值);一般是用于删除数组中的元素,或者是替换元素,或者是插入元素

原文链接:blog.csdn.net/qq_38244874…

常用数组和对象操作



// -----------------------------------------------------------------

// 对象合并 、两个对象合并
// 方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。返回值是目标对象。
const obj = { a: 1, b: 2 };
const obj2 = { b: 4, c: 5 };
let obj5=Object.assign(obj,obj2);
console.log(obj5);//{ a: 4, b: 5, c: 3 }
console.log(obj);//{ a: 4, b: 5, c: 3 }
console.log(obj5===obj)//true


// -----------------------------------------------------------------


// switch 判断

var id = 1;
switch (id) {
    case 1 :
        console.log("普通会员");
        break;  //停止执行,跳出switch
    case 2 :
        console.log("VIP会员");
        break;  //停止执行,跳出switch
    case 3 :
        console.log("管理员");
        break;  //停止执行,跳出switch
    default :  //上述条件都不满足时,默认执行的代码
        console.log("游客");
}


// -----------------------------------------------------------------

// while 循环语法
var i = 1;
while( i <= 5) {
    document.write(i+", ");
    i++;
}
// 运行结果:1, 2, 3, 4, 5,



// -----------------------------------------------------------------
// for 循环语法
for (var i = 1; i <= 10; i++) {
    document.write(i + " ");
}


//break 语句 
// 使用 break 语句跳出 for 循环 
for (var i = 0; i < 10; i++) {
    if(i == 5) {
        break;
    }
    document.write("i = " + i + "<br>");
}
document.write("循环之外的代码");



// continue 语句
// continue 语句用来跳过本次循环,执行下次循环。当遇到 continue 语句时,程序会立即重新检测条件表达式,如果表达式结果为真则开始下次循环,如果表达式结果为假则退出循环。
// break 语句用来跳出整个循环,执行循环后面的代码;continue 语句用来跳过当次循环,继续执行下次循环。
for (var i = 0; i < 10; i++) {
    if(i % 2 == 0) {
        continue;
    }
    document.write(i + "&nbsp;");
}

// -----------------------------------------------------------------
// for in 循环
// 是一种特殊类型的循环,也是普通 for 循环的变体,主要用来遍历对象,使用它可以将对象中的属性依次循环出来

// 定义一个对象
var person = {"name": "Clark", "surname": "Kent", "age": "36"};
// 遍历对象中的所有属性
for(var prop in person) {
    console.log(prop) // name surname age
    console.log(person[prop]) // Clark  Kent  36
}


// -----------------------------------------------------------------

// forEach 遍历
// forEach方法中的function回调有三个参数:
// 第一个参数是遍历的数组内容,
// 第二个参数是对应的数组索引,
// 第三个参数是数组本身

var arr = [1,2,3,4,5];
arr.forEach((item,index,arr)=>{
   //item 为当前数组元素
   // index 为当前索引
   // arr 为数组名字
   console.log(item); // 1  2  3  4  5
})



 var arr = [1,2,3,4];
    arr.forEach(alert); 
 
//    等价于:
    
var arr = [1, 2, 3, 4];
for (var k = 0; k < arr.length; k++) {
    alert(arr[k]);
}  



// -----------------------数组操作-push 、 pop、unshift、 shift-----------------------------------------
push( ) 尾部追加 

// 方法:可以将一个或者更多的参数添加在数组的尾部;返回添加后的数组的长度,原数组发生改变。
var arr=[1,2,3,4];
var a=arr.push(9,8,7);
console.log(a,arr);//1,2,3,4,9,8,7;


// -----------------------------------------------------------------

unshift() 头部追加

// 语法: array.unshift(item1,item2, …, itemX)
// unshift( )方法:可以将一个或者更多的参数添加在数组的头部;返回添加后的数组的长度,原数组发生改变。
var arr=[1,2,3,4];
var a=arr.unshift(9,8,7);
console.log(a,arr);//9,8,7,1,2,3,4;



// -----------------------------------------------------------------
 pop () 尾部删除

// 语法:array.pop()
// pop( )方法:从数组尾部删除一个元素,返回这个被删除的元素,原数组发生改变。
var arr=[1,2,3,4];
var a=arr.pop();
console.log(a,arr)//4;1,2,3,


// -----------------------------------------------------------------
 shift  头部删除

// 语法:array.shift()
// shift( ) 方法:从数组头部删除一个元素,返回这个被删除的元素,原数组发生改变。
var arr = [1,2,3,4];
var a = arr.shift();
console.log(a,arr)//1;2,3,4,


// -----------------------------------------------------------------
 join () 把数组转换为字符串

// 语法:array.join(separator)
// join( ) 方法:于把数组中的所有元素转换一个字符串,元素是通过指定的分隔符进行分隔的。

var a = [1,2,3,4,5];  //定义数组
var s = a.join("==");  //指定分隔符
console.log(s);  //返回字符串“1==2==3==4==5”



// -----------------------------------------------------------------
 toString() 把数组转换为字符串

// 数组中 toString() 方法能够把每个元素转换为字符串,然后以逗号连接输出显示。
var a = [1,2,3,4,5,6,7,8,9,0];  //定义数组
var s = a.toString();  //把数组转换为字符串
console.log(s);  //返回字符串“1,2,3,4,5,6,7,8,9,0”
console.log(typeof s);  //返回字符串string,说明是字符串类型


// -----------------------------------------------------------------
 split() 方法把字符串转为数组。
// split() 方法是 String 对象方法,与 join() 方法操作正好相反。该方法可以指定两个参数,第 1 个参数为分隔符,指定从哪儿进行分隔的标记;第 2 个参数指定要返回数组的长度。
var s = "1==2== 3==4 ==5";
var a = s.split("==");
console.log(a); //['1', '2', ' 3', '4 ', '5']
console.log(a.constructor == Array); //true


// -----------------------------------------------------------------
indexOf() 
// 方法:字符串的方法,数组也可适用,此方法可返回某个指定的字符串值在字符串中首次出现的位置;若一个参数,返回这个参数在数组里面的索引值,如果参数不在操作的数组中,则返回 -1。
var arr = ['北京','上海','深圳','广州'];
var ar1 = arr.indexOf('深圳') // 2
var ar2 = arr.indexOf('成都') // -1

// -----------------------------------------------------------------

includes()

//includes() 方法用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回 false。
let arr = ['北京','上海'];
 
 console.log(arr.includes('上海')); // true
 console.log(arr.includes('深圳')); // false


// 普通写法,乍一看,这么写似乎没什么大问题。然而,如果我们想要匹配更多的条件呢?我们是不是得用更多的 “||” 来拓展这条语句
if (x === "abc" || x === "def" || x === "ghi" || x === "jkl") {
  // code logic
}

// 我们可以使用更简洁的语法 Array.includes(Array.includes) 重写以上条件句
if (["abc", "def", "ghi", "jkl"].includes(x)) {
  // code logic
}


// -----------------------------------------------------------------
//  数组合并1


// 数组合并 push   会变更原数组,当然也可以写成生成新数组的形式。
let arr = ['北京','上海'];
let arr2 = ['深圳','广州'];

for (let i = 0; i < arr2.length; i++) {
    console.log(arr2[i]) // 深圳 广州
	arr.push(arr2[i]) 
}
console.log(arr) // ['北京', '上海', '深圳', '广州']

// -----------------------------------------------------------------


//  数组合并2


// 数组合并 concat  会生成新的数组。

let arr = ['北京','上海'];
let arr2 = ['深圳','广州'];
arr3 = arr.concat(arr2)
console.log(arr) // ['北京', '上海', '深圳', '广州']

let arr3 = arr = arr.concat(arr2)
console.log(arr === arr3) // true  不会变更原理数组

// -----------------------------------------------------------------
//  数组合并3


// 数组合并 apply  会变更原数组。
let arr = ['北京','上海'];
let arr2 = ['深圳','广州'];
arr.push.apply(arr, arr2) // ['北京', '上海', '深圳', '广州']
console.log(arr)
let arr3 = arr.push.apply(arr, arr2)
console.log(arr === arr3) // false



// -----------------------------------------------------------------
//  数组合并4  ES6 新语法  会生成新的数组。

let arr = ['北京','上海'];
let arr2 = ['深圳','广州'];
arr = [...arr, ...arr2]
console.log(arr) // ['北京', '上海', '深圳', '广州']
let arr3 = [...arr, ...arr2]
console.log(arr === arr3) // false




// -----------------------------------------------------------------

JSON.stringify()
// 把对象序列化为一个JSON字符串  对象转字符串
let json1 = {
  title: "Json.stringify",
  author: [
    "浪里行舟"
  ],
  year: 2021
};
let jsonText = JSON.stringify(json1);

// jsonText的值是这样的:
// "{"title":"Json.stringify","author":["浪里行舟"],"year":2021}"


// -----------------------------------------------------------------

JSON.parse()
// J将JSON格式字符串转换为js对   对象字符串转换成对象
var jstr = '{"name":"wust", "url":"www.wust.edu.cn", "age":120}'
var obj = JSON.parse(jstr);
// 结果 obj= { name:"wust", url:"www.wust.edu.cn", age:120 }

// 对象字符串转换成对象数组
var jarrstr = '[{"id":101,"name":"计算机科学"},{"id":102,"name":"软件工程"}]'
var arr = JSON.parse(jarrstr);
// 结果 arr = [ {id:101,name:"计算机科学"}, {id:102,name:"软件工程"} ]




// -----------------------------------------------------------------

JSON.parse(JSON.stringfy(obj))

##### 3. 深拷贝数组或对象
// 对象或数组的简单赋值,修改新值也会改变原值。这时我们需要获取原值的深拷贝对象。

// 对于对象,可以通过newObj = JSON.parse(JSON.stringfy(obj))实现。

// 对于数组,可以通过 newArr = […arr]或者newArr = arr.slice(0)来实现。




数组查找元素
是否存在:

// -----------------------------------------------------------------


find ()
// 满足一定条件的并返回值:
//find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。
const array1 = [5, 12, 8, 130, 44];
// 按顺序返回 大于12 的数,所以是130 而不是44
const found = array1.find(element => element > 12);
console.log(found); // 130

// -----------------------------------------------------------------


.findIndex()
//  满足一定条件的并返回下标:
//findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回-1。
const array1 = [5, 12, 8, 130, 44];
// 按顺序返回 大于12 的数的下标
const found = array1.findIndex(element => element > 12);
console.log(found); // 3


// -----------------------------------------------------------------



splite()
// 字符串转数组 
String.prototype.splite()

const str = 'The quick brown fox jumps over the lazy dog.';
const words = str.split(' ');//这里传了空格分隔符
console.log(words);
//expected output:["The", "quick", "brown", "fox", "jumps", "over", "the", "lazy", "dog."]


// -----------------------------------------------------------------


Object.entries() // 对象转数组

const obj = { foo: 'bar', baz: 42 };
console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ]

// -----------------------------------------------------------------



对象的深拷贝

JSON.parse(JSON.stringify(state.category))

先转成json再转成对象
//JSON.stringify() 方法将一个 JavaScript 对象或值转换为 JSON 字符串
 
console.log(JSON.stringify({ x: 5, y: 6 }));
// expected output: "{"x":5,"y":6}"
 


// -----------------------------------------------------------------



//JSON.parse() 方法用来解析JSON字符串,构造由字符串描述的JavaScript值或对象。
const json = '{"result":true, "count":42}';
const obj = JSON.parse(json);
console.log(obj);
// expected output: { result: true, count: 42 }


// -----------------------------------------------------------------



for...in  //对象的遍历

//for ... in是为遍历对象属性而构建的,它最常用的地方应该是用于调试,可以更方便的去检查对象属性



原文链接:blog.csdn.net/weixin_5081…

取差集

// set 实现
let a = new Set([1, 2, 3])
let b = new Set([2, 3, 4])
let differ = Array.from(new Set([...a].filter(item => !b.has(item)))) // [1]


// includes 实现
arr1 = [1, 2, 3, 4];
arr2 = [1, 3];
let difference = arr1.filter(x => !arr2.includes(x)) // [2, 4]

取交集

// set 实现
let a = new Set([1, 2, 3])
let b = new Set([4, 2, 3])
let inter = [...new Set([...a].filter(item => b.has(item)))] // [2, 3]

数组合并去重

// set 实现
let a = new Set([1, 2, 3])
let b = new Set([4, 2, 3])
let union = [...new Set([...a, ...b])] // [1, 2, 3, 4]


// Lodash _.uniqWith() 实现(可以处理引用类型)
var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }, { 'x': 1, 'y': 2 }];
_.uniqWith(objects, _.isEqual);
// _.isEqual(value,other)用于执行深比较来确定两者的值是否相等。 _.uniqWith()做去重处理。

合并对象

this.taskList = this.taskList.map(item => {
    return Object.assign({}, item, {'isShowAllImg': false})
})

数组对象 转 对象

// reduce 实现
const arr = [
    { key: 'CN', name: 'China' },
    { key: 'US', name: 'USA' },
    { key: 'JP', name: 'Japan' },
    { key: 'EU', name: 'Eurozone' }
]

const obj = arr.reduce((acc, cur) => {
    acc[cur.key] = cur.name
    return acc
}, {})

数组 转 数组对象

const list = ["Alabama", "Alaska"],
const listObj = this.states.map(item => {
    return { k: `${item}`, v: `${item}` };
});

去掉数组对象中指定的属性

// 要删除pk这个属性
// 尽量不修改原来对象
const arr = [{ table: [{ key: 3, g: 'g' }, { key: 4, g: 'g' }], a: {} }, { table: [{ key: 1, g: 'g' }, { key: 2, g: 'g' }], b: {} }]

const copy = arr.map(item => {
  return {
    ...item,
    table: item.table.map(tb => {
      return Object.keys(tb).reduce((init, cur) => {
        if (cur !== 'key') {
          init[cur] = tb[cur]
        }
        return init

        // 可以替换上面的3行
        // if(key ==='key') return init;
        // init[cur] = tb[cur];
        // return init;

      }, {})
    })
  }
})

console.log(copy);

替换指定字符串

'asd'.replace('s', '') // 'ad'

valueOf()

返回各自数据类型的原始值

toString()

把数字转换为字符串,使用指定的基数。

toLocalString()

把数字转换为字符串,使用本地数字格式顺序。

var num = new Number(1337);

console.log(num.valueOf()); // 1337                类型:number
console.log(num.toString()); // 1337               类型:string
console.log(num.toLocaleString()); // 1,337       类型:string(本地格式)


var date = new Date();
console.log(date.valueOf()); // 1231231231234                类型:number
console.log(date.toString()); // Sat Jul 23 2010 17:22       类型:string
console.log(date.toLocaleString()); // 2010/7/7 下午4:03:05  类型:string


var array = new Array("niu","li","na");
console.log(array.valueOf()); // ["niu","li","na"]    类型:Array
console.log(array.toString()); // niu, li, na         类型:string
console.log(array.toLocaleString()); // niu, li, na   类型:string

字符串转数字

// 首个字符是否是数字。如果是,则对字符串进行解析,直到到达数字的末端为止,然后以数字返回该数字。保留小数
parseFloat() // 可解析一个字符串,并返回一个浮点数 

parseInt() // 函数可解析一个字符串,并返回一个整数