【前端学习之路】 ES6语法 (黑马前端课程笔记)

发布于:2023-02-02 ⋅ 阅读:(468) ⋅ 点赞:(0)

 创建类和对象

通过 class 关键字创建类,类名习惯定义首字母大写,类里有个constructor函数,只要new生产实例时,会自动调用这个函数 

* 继承  用 extends 关键字

* 调用父类中的成员函数 用 super 关键字 ()构造函数也可以用

:子类在构造函数中使用super,必须放到 this 前面(必须先调用父类的构造方法再使用子类构造方法)

* 加 this 使用

类里面共有方法和属性一定要加 this 使用

1、什么是ES6 

ES的全称是ECMAScript,它是由ECMA国际标准化组织制定的一项脚本语言的标准化规范

2、ES6的新增语法

* let关键字

let声明的变量只在所处于的块级({ }内部)有效,外部不可访问   块级作用域

let声明的变量没有变量提升

let声明的变量会导致暂时性死区

 * const关键字

用来声明常量,即值(内存地址)不能变化的量

const声明的常量也具有块级作用域

const声明常量时必须赋初始值 

* 解构赋值

将数组或对象解构,提取值按照对应位置赋值给变量

* 箭头函数

箭头函数是用来简化函数定义语法的

()=> {}

()内用来写形参,{ } 内用来写函数体

(若函数体中只有一句代码,且代码的执行结果就是返回值,则可以省略大括号)

 (当形参只有一个时,则小括号可以省略)

 箭头函数不绑定 this 对象,如果在箭头函数中使用this关键字,则将指向箭头函数上下文位置的this

* 剩余参数

当实参个数大于形参个数情况时,剩余参数语法允许我们接收多出的实参,将其表示为一个数组

 * 扩展运算符

... 为扩展运算符,可以将数组转为用逗号分隔的参数序列

let arr = [1, 2, 3] ; 

cosole.log(...arr);         // 1 2 3

扩展运算符运用在数组合并

 还可以用  ary1.push(...ary2); 扩展数组

* Array

Array.from () 将伪数组转化成真正的数组

 Array.from () 方法还可以接收第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值返回原数组

Array.find ()   用于找出第一个符号条件的数组成员,如果没有找到则返回undefined

Array.findIndex ()   用于找出第一个符合条件的数组成员的(索引)位置,如果没有找到则返回-1

Array.includes () 表示某个数组是否包含给定的值,返回布尔值

String的扩展方法

* 模板字符串 (要用反引号)

${ }

模板字符串可以解析变量

 模板字符串可以自动换行

模板字符串可以调用函数

 * startWith () :表示参数字符串是否在原字符串的头部,返回布尔值

 * endWith () :表示参数字符串是否在原字符串的尾部,返回布尔值

 * repeat () : 表示将原字符串重复n次,返回一个新字符串

ES6新添加的数据结构

* Set 数据结构

set 数据结构类似于数组,但其存储的成员的值都是唯一的,没有重复值

Set本身是一个构造函数,用来生产Set 数据结构,它的一个实例化对象就是一个set数据结构

Set 常用方法

 遍历set数据结构  (也是利用forEach)


网站公告

今日签到

点亮在社区的每一天
去签到