2021-03-18ES6-2

数据类型

string

模板字符串

`

`

允许换行

    var container = document.querySelector(".container");

    container.innerHTML  = `

   

       

               

  •            

  •            

  •            

  •            

  •        

   

    `;

支持嵌入变量


新增方法

includes():返回布尔值,判断是否找到参数字符串。

startsWith():返回布尔值,判断参数字符串是否在原字符串的头部。

endsWith():返回布尔值,判断参数字符串是否在原字符串的尾部。


字符串重复

repeat

console.log("Hello,".repeat(2));  // "Hello,Hello,"


字符串补全

padStart

padEnd

console.log("h".padStart(5,"o"));  // "ooooh"

console.log("h".padEnd(5,"o"));    // "hoooo"

console.log("h".padStart(5));      // "    h"


array

创建数组

Array.of()

Array.from()

查找符合的元素

find

    var arr = [33,4,2,99];

    var v = arr.find(function (item) {

        return item<10;

    });

    console.log(v);

查找符合元素的下标

findIndex()

    var index = arr.findIndex(function (item) {

        return item < 10;

    })

    console.log(index);


填充

fill(要填充的值,填充的位置,可选(填充结束的位置)) 

返回一个填充好的数组

let arr = Array.of(1, 2, 3, 4);

// 参数1:用来填充的值

// 参数2:被填充的起始索引

// 参数3(可选):被填充的结束索引,默认为数组末尾

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

嵌套数组(多维)转一维数组

flat

    var arr5 = [[[[1,4,5]],[55,77]],[3,9]]

    //Infinity 无穷数

    var arr6 = arr5.flat(Infinity);

    console.log(arr6);

合并数组

    var arr7 = [3,4,88];

    console.log([1,...arr7]);

set

类似数组

set里面的数据 都是唯一的

初始化

new Set()

存取值


存值

add();

数组去重

    var arr7 = [77,55,77,99,55];

    var set2 = new Set(arr7);

    console.log(set2);

map

类似Object

一个 Object 的键只能是字符串或者 Symbols,但一个 Map 的键可以是任意值。

Map 中的键值是有序的(FIFO 原则),而添加到对象中的键则不是。

Map 的键值对个数可以从 size 属性获取,而 Object 的键值对个数只能手动计算。

Object 都有自己的原型,原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。

初始化


new Map()

存取之

set(key,value)

get(key)

长度

size

遍历

for in

    for (let key in map){

        console.log(map.get(key));

    }

for of

    for ( let [key,value] of map){

        console.log(key,value);

    }

forEach

    map.forEach(function (item,key) {

        console.log(item,key)

    })



函数

可以给函数的形参 添加默认值

    function f(a=1,b=3) {

    }

箭头函数

作用

语法简洁


var fun2 = function () {

        console.log("...");

    }

    var fun2 = ()=>{

        console.log("....");

    }

    fun2();

    //传参数 简化写法

    var fun3 = a => {

        console.log(a);

    }

    var fun4 = (a,b) => {

        console.log(a,b);

    }

    //函数体比较简单 省略花括号

    var sum = (a,b) => a+b;

    var sum = function (a,b) {

        return a+b;

    }


无需在箭头函数中 再去设置this指向

  function View() {

        this.title = "标题";

        var self = this;

        this.dom = document.querySelector(".container");

        this.dom.onclick = function () {

            alert(self.title)

        }

        this.dom.onclick =  ()=> {

            alert(this.title)

        }

    }

    new View();

你可能感兴趣的:(2021-03-18ES6-2)