ES6 重点内容整理

let 和 const

—— let 和 var 的差异

        — let 允许声明一个 作用域限制在块级中的变量、语句或者表达式

                — 块级作用域

        — var 声明的变量只能是全局或者整个函数块的函数作用域

        — let 不能重复声明

        — let 不会被预解析,必须先声明再使用

—— const 常量

        — 常量不能重新赋值:必须在声明时赋值,并且不能修改

        — 不能重复声明

        — 块级作用域

        — 不会被预解析


箭头函数

—— 箭头函数的各种写法

        — 普通声明方式:`(参数) => {}`

        — 两种简写方式(可同时使用):

                — `参数 => {}` 当箭头函数的参数有且只有一个时,参数处的小括号可以省略

                — `(参数) => ()` 当函数后面所写的表达式就是函数的返回值时,可以将大括号省略或者改为小括号包裹

—— 箭头函数的 this 问题

        — 箭头函数本身没有 this,箭头函数中的 this 指向的是箭头函数在声明时所在的作用域的 this

—— 箭头函数的不定参问题

        — 箭头函数没有 arguments 参数;可通过展开运算来获取不定参

—— rest 参数设置  剩余参数

—— 参数默认值设置

filter 方法

—— filter 数组的一个方法-过滤数组

        过滤方式:在回调中写一个返回值,他会返回所有符合要求的项

—— 调用方法:`Array.prototype.filter(function(item, index, arr) {})`

        filter 本身接收两个参数,第一个参数是一个回调函数,第二个参数是 this 指向;

        当传入第二个参数时,第一个参数这个回调函数执行的时候 this 会指向此参数所传 this;

        第一个回调函数中,有3个参数

            — 一是循环时的每一项

            — 二是每一项所对应的下标值

            — 三是调用 filter 方法的数组本身


展开运算符 ... 和解构赋值

对象展开
数组展开
数组解构
对象解构
字符串解构

—— 展开运算符还可以用作拷贝

—— 展开运算符是可以和 `Object.assign` 做相同作用的

        注意:展开运算符作拷贝也是浅拷贝,所以如果被展开对象(数组)中,有键值(数组项)也为复杂类型时,需要进行进一步展开(深拷贝原理)

—— 解构赋值快速交换 a, b 的值


Set 对象

—— Set 对象的数据结构

—— Set 相关属性与方法

        — size 属性 数据长度

        — clear() 方法   清空 set 对象

        — delete() 方法   删除子项,返回 true | false 删除成功(存在)则为 true

        — has() 方法   是否包含子项, 返回 true | false

        — add() 方法   添加子项,返回 set 数据本身

数组去重


Map 对象

—— Map 对象的数据结构

—— Map 相关属性与方法

        — size 属性

        — clear()、delete()、get()、has()

        — set() 方法   添加子项,返回 map 本身

数组新增方法

1、Array.from

—— Array.from(arrayLike[, mapFn[, thisArg]]) 将类数组转换成数组

        — 参数:arrayLike 类数组

        — 可选参数:mapFn 类似 map 的方法,循环类数组时的回调函数,返回值组成新数组

                              thisArg mapFn 函数执行时的 this 指向

        — 返回值:根据 arrayLike 生成的新数组

例子

2、Array.isArray

—— Array.isArray(data) 检测数据是否是一个数组

        — 参数: data 要检测的数据

        — 返回值: true 数组,false 非数组

3、Array.of

—— Array.of(element0[, element1[,  ...[, elementN]]]) 将参数转成一个数组

        — 参数:elementN 要放入数组中的数据

        — 返回值:新数组

4、arr.find

—— arr.find(callback[, thisArg]) 查找数组中满足要求的第一个元素的

        — 参数:callback 在数组每一项上执行的函数,接受三个参数

                        element 当前遍历到的元素

                        index[可选] 当前遍历到的索引

                        array[可选] 数组本身

        — 可选参数:thisArg 执行回调时用作 this 的对象

        — 返回值: 数组中第一个满足所提供回调函数的元素的值,否者返回 undefined

5、arr.findIndex

—— arr.findIndex(callback[, thisArg]) 查找数组中满足要求的第一个元素的索引

        — 参数、返回值同上

6、arr.flat

—— arr.flat([depth]) 扁平化多维数组

        — 可选参数:depth 指定要提取嵌套数组的结构深度,默认值为 1

            Infinity,全部展开

        — 返回值:一个将数组与子数组中所有元素的新数组

7、arr.flatMap

—— arr.flatMap(function callback(currentValue[, index[, array]]) {

                 // 返回新数组的元素

             }[, thisArg])

             方法首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。

             他与 map 和深度值为 1 的 flat 几乎相同,但 flatMap 通常在合并成一种方法的效率稍微高一些

        — 参数:callback 可以生成一个新数组中的元素的函数,可传三个参数:

                        currentValue 当前正在数组中处理的元素

                        index[可选] 数组中正在处理的当前元素的索引

                        array[可选] 被调用的 map 数组

        — 可选参数:thisArg 执行 callback 函数时使用的 this 值

        — 返回值:一个包含将数组与子数组中所有元素的新数组

例子

8、arr.fill

—— arr.fill(value[, start[, end]]) 用一个固定值填充一个数组从起始索引到终止索引内的全部元素,不包括终止索引

        — 参数:用来填充数组元素的值

        — 可选参数:start 起始索引,默认值为 0

                              end 终止索引,默认值为 arr.length 

9、arr.includes

—— arr.includes(valueToFind[, fromIndex]) 判断数组中是否包含一个指定的值

        — 参数:valueToFind 需要查找的值

        — 可选参数:从 fromIndex 处开始向后查找,负数则从右往前数

        — 返回值:true 代表数组中包含 valueToFind, false 代表数组中不包含 valueToFind


新增对象方法

1、Object.assign

—— Object.assign(target, ...sources) 将所有可枚举属性的值从一个或多个源对象复制到目标对象

        — 参数:target 目标对象

        — sources 源对象

        — 返回值:目标对象

2、Object.is

—— Object.is(value1, value2) 判断两个值是否是相同的值

        — 规则:两个值都是 undefined

                       两个值都是 null

                       两个值都是 true 或者都是 false

                       两个值是由相同个数的字符按照相同的顺序组成的字符串

                       两个值指向同一个对象

                       两个值都是数字并且

                            都是正零 +0

                            都是负零 -0

                            都是 NaN

3、对象简洁表示法

        — 属性简洁表示

        — 方法简洁表示

4、属性名表达式


新增字符串方法

1、str.includes

—— str.includes(valueToFind[, fromIndex]) 判断字符串是否包含一个指定值

        — 同数组的 includes

2、str.endsWith

—— str.endsWith(searchString[, length]) 判断当前字符串是否是以另一个给定的字符串“结尾”

        — 参数:searchString 要搜索的子字符串

        — 可选参数:length 作为 str 的长度,默认值为 str.length

        — 返回值:如果传入的子字符串在搜索字符串的末尾则返回 true; 否则返回 false

3、str.startsWith

—— str.startsWith(searchString[, position]) 判断当前字符串是否是以另一个给定的子字符串开头

        — 同上

        — 可选参数:position 在 str 中搜索 searchString 的开始位置,默认值为 0

4、str.repeat

—— str.repeat(count) 构造并返回一个新字符串,该字符串包含被连接在一起的指定数量的字符串

        — 参数:count 介于 0 和正无穷之间的整数,表示在新构造的字符串中重复了多少遍原字符串

        — 返回值 生成的新字符串

5、模板字符串

—— 模板字面量 是允许嵌入表达式的字符串字面量。 ``

            可以使用多行字符串和字符串插值功能。 ${name}

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 219,589评论 6 508
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,615评论 3 396
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 165,933评论 0 356
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,976评论 1 295
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,999评论 6 393
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,775评论 1 307
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,474评论 3 420
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,359评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,854评论 1 317
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 38,007评论 3 338
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,146评论 1 351
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,826评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,484评论 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,029评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,153评论 1 272
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,420评论 3 373
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,107评论 2 356

推荐阅读更多精彩内容

  • .说说Promise Promise 是异步编程的一种解决方案,比传统的异步解决方案【回调函数】和【事件】更合理、...
    酷酷的凯先生阅读 403评论 0 0
  • ES6 包括 变量、函数、数组、json、字符串、面向对象、promise、generator、async/awa...
    Ethan_zyc阅读 2,071评论 0 2
  • IIFE立即执行函数TDZ暂时性死区 es2020 1.新增全局对象 globalThis2.新增String.p...
    liuhuijuan阅读 287评论 0 0
  • 解构赋值*特别有用,尤其是ajax赋值 let [a,b,c] = [12,4,5]console.log(a,b...
    北京前端开发XM阅读 191评论 0 0
  • let、var、const 之间的区别? let:1> 拥有块级作用域:声明的变量只在所在的代码块有效;2> 不存...
    婆娘漂亮生活安逸阅读 808评论 0 2