[JavaScript知识库]ES6字符串新增方法、新增数据类型以及类

一、字符串新增方法

1、.repeat() 重复 ?返回新字符串

案例：

????????let str="hello world"

? ? ? ? let result=str.repeat(3)

? ? ? ? console.log(result) //hello worldhello worldhello world

2、?includes() 是否包含指定内容

案例：

???????let str="hello world"

? ? ? ? let result=str.includes("x")

? ? ? ? console.log(result)? //F

3、indexOf() 返回指定元素的对应位置 ?没有返回-1

案例：

???????let str="hello world"

? ? ? ? let result=str.indexOf("x")

? ? ? ? console.log(result) //-1

4、startsWith() 是否以什么开头

案例：

????????let str="hello world"

? ? ? ? let result=str.startsWith("he")

? ? ? ? console.log(result)? //T

5、endsWith() ?是否以什么结尾

案例：

???????let imgUrl="1.jpg"

? ? ? ? let result=imgUrl.endsWith("png")

? ? ? ? console.log(result) //F

6、trim() 清除前后的空格 ！！！！！

案例：

????????let str=" hello world "

? ? ? ? console.log(str=="hello world")? //false

? ? ? ? let result=str.trim()

? ? ? ? console.log(result=="hello world")//t

二、新增数据类型

1、map类型，是对原有的对象类型的加强版，原本对象类型的key只能是字符串，map类型可以让任意类型的数据作为对象的key。

案例：

????????let bt1=document.getElementById("bt1")

? ? ? ? let m=new Map() //创建一个map对象

? ? ? ? m.name="王一"

? ? ? ? //如果是特殊的变量，作为key值，需要使用set get方法

? ? ? ? m.set(bt1,"5")

? ? ? ? console.log(m)

? ? ? ? console.log(m.get(bt1))

2、symbol类型，独一无二的值，防止出现命名的冲突问题，主要用于作为对象的key值

案例：let s=Symbol("name")

? ? ? ? let obj={

? ? ? ? ? ? age:21

? ? ? ? }

? ? ? ? obj[s]="王一"

? ? ? ? obj.name="王二"

? ? ? ? obj.s="哈哈"

? ? ? ? console.log(obj)

备注：现在JavaScript有的数据类型：object、number、null、Boolean、string、undefined、map、symbol

三、类

之前的js没有 类这个概念 所以创建对象时只能使用构造函数创建

案例：创建一个人类 name,age,height run方法，继承一个学生类

?//通过class直接创建类

? ? ? ? class People{?

? ? ? ? ? ? constructor(name,age,height){? ? ? ? ?//构造函数

? ? ? ? ? ? ? ? this.name=name

? ? ? ? ? ? ? ? this.age=age

? ? ? ? ? ? ? ? this.height=height

? ? ? ? ? ? }

? ? ? ? ? ? run(){? ? ? ? ? ? ?//原型方法

? ? ? ? ? ? ? ? console.log("正在跑")

? ? ? ? ? ? }

? ? ? ? }

//继承一个学生类

class Student extends People{? ? ?//extends? 继承

? ? ? ? ? ? constructor(name,age,height,score){

? ? ? ? ? ? ? ? //super()方法? 调用父级的构造函数

? ? ? ? ? ? ? ? super(name,age,height)

? ? ? ? ? ? ? ? //super必须写在 自己属性的上方

? ? ? ? ? ? ? ? this.score=score

? ? ? ? ? ? }

? ? ? ? ? ? showInfo(){? ? ? ? ? ?//自己的方法

? ? ? ? ? ? ? ? console.log(this.name)

? ? ? ? ? ? }

? ? ? ? ? ? run(){? ? ? ? ? ? ? ? ?//替换父类的方法

? ? ? ? ? ? ? ? console.log(this.name+"正在跑")

? ? ? ? ? ? }

? ? ? ? }

构造函数与class类的区别

1、严格模式

类和模块的内部，默认就是严格模式，所以不需要使用use strict指定运行模式。

只要你的代码写在类或模块之中，就只有严格模式可用。考虑到未来所有的代码，其实都是运行在模块之中，所以 ES6 实际上把整个语言升级到了严格模式

2、不存在提升，类不存在变量提升（hoist），这一点与 ES5 完全不同。

3、方法默认是不可枚举的

ES6 中的 class，它的方法（包括静态方法和实例方法）默认是不可枚举的，而构造函数默认是可枚举的。细想一下，这其实是个优化，让你在遍历时候，不需要再判断 hasOwnProperty 了

4、class 的所有方法（包括静态方法和实例方法）都没有原型对象 prototype，所以也没有[[construct]]，不能使用 new 来调用。

5、class 必须使用 new 调用，否则会报错。这是它跟普通构造函数的一个主要区别，后者不用 new 也可以执行。

6、ES5 和 ES6 子类 this 生成顺序不同

ES5 的继承先生成了子类实例，再调用父类的构造函数修饰子类实例。

ES6 的继承先生成父类实例，再调用子类的构造函数修饰父类实例。这个差别使得 ES6 可以继承内置对象。

7、ES6可以继承静态方法，而构造函数不能。