字符串、对象、数组新功能-js

字符串

1、includes()：

返回布尔值，判断是否找到参数字符串。

       var str = "hello,hlll"
        var re1 = str.includes("hlll")
        var re2 = str.includes("") //包含
        var re3 = str.includes(" ")
        console.log(re1, re2, re3)//true true false

2、startsWith()、endsWith()

     var str = "hello"
        console.log(str.includes("")); //返回布尔值
        var re = str.startsWith("he") //是不是以he开始 返回布尔值
        var re1 = str.endsWith("ll", 3) 
        //3的下标结束然后看是不是ll结尾  返回布尔值
        //以上三个方法都可以接受两个参数，需要搜索的字符串，和可选的搜索起
        //始位置索引
        console.log(re);

3、repeat()

        var str = "hello    "
        var re = str.repeat(10)
        var re1 = "***  ".repeat(str.length)
        console.log(re); //重复10次
        console.log(re1);

结果：

4、padStart、padEnd

      var str = "243688"
        var re = str.padStart(15, "171501") //一共15个字符，不够会平铺
        console.log(re); //171501171243688
        var re1 = str.padEnd(15, "171051")
        console.log(re1);

结果：

5、模板字符串

         var a = 1324325
        //拼接字符串
        var str = `heloo${a}
        h5
        `
        console.log(str);
        var r = parseInt(Math.random() * 255)
        var g = parseInt(Math.random() * 255)
        var b = parseInt(Math.random() * 255)
        var bgccolor = 'rgb(' + r + ',' + g + ',' + b + ')'
        var bgccolor2 = `rgb(${r},${g},${b})`
        console.log(bgccolor, bgccolor2);

对象

1、对象成员简写

         var count = 20
		var obj = {
			count
		}
//es6的对象成员可以写做 一个单词 这个单词是变量名:把变量名作为对象的属性
//名值取出作为属性值(易于读取,提高开发效果)
		console.log(obj.count); //20

2、方法简写

       var obj = {
			name: "karen",
			say: function() {}
		}
		var obj2 = {
			name: "jack",
			say() {}
		}

3、Number

        //1
        var num = new Number("244")
        console.log(num.valueOf());
        //2
        var num1 = "244" - 0
        console.log(num1);
        //3
        var num2 = Number("244")
        console.log(num2);
        //4
        var num3 = Number("hello")
        console.log(num3); //NaN\
        // window.isNaN(x) //不是数字就返回true(有隐式转换)
        var x = "43"
        var re1 = Number.isNaN(x) //不是NAN就返回false(没有隐式转换)
        console.log(re1);
        var re = isNaN({})
        console.log(re)
        var re2 = Number.isNaN({})
        console.log(re2)

     var re1 = Number.parseInt('0011', 16); 
        console.log(re1);//17

结果：

4、扩展运算符

//拓展运算符（...）用于取出参数对象所有可遍历属性然后浅拷贝到当前对象。
        let person = {
            name: "Amy",
            age: 15
        };
        let someone = {
            ...person
        };
        console.log(someone); //{name: "Amy", age: 15}

1、扩展运算符合并两个对象

       let person = {
            name: "Amy",
            age: 15
        };
        let someone = {
            ...person,
            name: "Mike",
            age: 17
        };
        console.log(someone); //{name: "Mike", age: 17}

2、

①自定义的属性在拓展运算符后面

自定义的属性在拓展运算符后面，则拓展运算符对象内部同名的属性将被覆盖掉

let person = {name: "Amy", age: 15};
let someone = { ...person, name: "Mike", age: 17};
console.log(someone);  //{name: "Mike", age: 17}

②自定义的属性在拓展运算度前面

自定义的属性在拓展运算度前面，则变成设置新对象默认属性值

let person = {name: "Amy", age: 15};
let someone = {name: "Mike", age: 17, ...person};
console.log(someone);  //{name: "Amy", age: 15}

5、Object.is(value1, value2)

Object.is(value1, value2)：用来比较两个值是否严格相等，与（===）基本类似。

Object.is("q","q");      // true
Object.is(1,1);          // true
Object.is([1],[1]);      // false
Object.is({q:1},{q:1});  // false

Object.is(value1, value2)与===的区别

//一是+0不等于-0
Object.is(+0,-0);  //false
+0 === -0  //true

//二是NaN等于本身
Object.is(NaN,NaN); //true
NaN === NaN  //false

数组

1、Array.of 、Array.from

Array.of()：将参数中所有值作为元素形成数组。
Array.from()：将类数组对象或可迭代对象转化为数组。

       var arr = Array.of(10, 4, 45, 23)
        console.log(arr); // [10, 4, 45, 23] //创建数组
        var arr1 = Array.from([4, 35, 32], function (el) {
            // 第一个为可遍历数据容器
            return el + 1
        })
        console.log(arr1); // [5, 36, 33]

2、Array.from转换可迭代对象

①转换map

let map = new Map();
map.set('key0', 'value0');
map.set('key1', 'value1');
console.log(Array.from(map)); 
// [['key0', 'value0'],['key1','value1']]

②转换set

let arr = [1, 2, 3];
let set = new Set(arr);
console.log(Array.from(set)); // [1, 2, 3]

③、转换字符串

let str = 'abc';
console.log(Array.from(str)); // ["a", "b", "c"]

3、数组方法

①find()

find()：查找数组中符合条件的元素,若有多个符合条件的元素，则返回第一个元素

let arr = Array.of(1, 2, 3, 4);
console.log(arr.find(item => item > 2)); // 3
 
// 数组空位处理为 undefined
console.log([, 1].find(n => true)); // undefined

②findIndex()

findIndex()：查找数组中符合条件的元素索引，若有多个符合条件的元素，则返回第一个元素索引

let arr = Array.of(1, 2, 1, 3);
// 参数1：回调函数
// 参数2(可选)：指定回调函数中的 this 值
console.log(arr.findIndex(item => item = 1)); // 0
 
// 数组空位处理为 undefined
console.log([, 1].findIndex(n => true)); //0

③fill()

fill()：将一定范围索引的数组元素内容填充为单个指定的值。

let arr = Array.of(1, 2, 3, 4);
// 参数1：用来填充的值
// 参数2：被填充的起始索引
// 参数3(可选)：被填充的结束索引，默认为数组末尾
console.log(arr.fill(0,1,2)); // [1, 0, 3, 4]

④entrys()

entrys()：遍历键值对

for(let [key, value] of ['a', 'b'].entries()){
    console.log(key, value);
}
// 0 "a"
// 1 "b"
 
// 不使用 for... of 循环
let entries = ['a', 'b'].entries();
console.log(entries.next().value); // [0, "a"]
console.log(entries.next().value); // [1, "b"]
 
// 数组含空位
console.log([...[,'a'].entries()]); // [[0, undefined], [1, "a"]]

⑤、keys()

keys()：遍历键名。

for(let key of ['a', 'b'].keys()){
    console.log(key);
}
// 0
// 1
// 数组含空位
console.log([...[,'a'].keys()]); // [0, 1]

⑥values()

values()：遍历键值

for(let value of ['a', 'b'].values()){
    console.log(value);
}
// "a"
// "b"
 
// 数组含空位
console.log([...[,'a'].values()]); // [undefined, "a"]

⑦includes()

includes()：数组是否包含指定值。注意：与 Set 和 Map 的 has 方法区分；Set 的 has 方法用于查找值；Map 的 has 方法用于查找键名。

// 参数1：包含的指定值
[1, 2, 3].includes(1);    // true
 
// 参数2：可选，搜索的起始索引，默认为0
[1, 2, 3].includes(1, 2); // false
 
// NaN 的包含判断
[1, NaN, 3].includes(NaN); // true

⑧flat嵌套数组降维

console.log([1 ,[2, 3]].flat()); // [1, 2, 3]
 
// 指定转换的嵌套层数
console.log([1, [2, [3, [4, 5]]]].flat(2)); // [1, 2, 3, [4, 5]]
 
// 不管潜逃多少层
console.log([1, [2, [3, [4, 5]]]].flat(Infinity)); // [1, 2, 3, 4, 5]
 
// 自动跳过空位
console.log([1, [2, , 3]].flat());// [1, 2, 3]

⑨数组扩展运算符

复制数组

let arr = [1, 2],
    arr1 = [...arr];
console.log(arr1); // [1, 2]
 
// 数组含空位
let arr2 = [1, , 3],
    arr3 = [...arr2];
console.log(arr3); [1, undefined, 3]

合并数组

console.log([...[1, 2],...[3, 4]]); // [1, 2, 3, 4]