

首页  思维导图  详情



近期目标

2017-03-30 10:39:51   0  举报





仅支持查看

AI智能生成

近期目标：在接下来的一个月内，我计划专注于提升我的专业技能和知识。我将通过参加在线课程和阅读相关书籍来实现这一目标。此外，我还计划每周至少花一个小时进行自我反思，以便更好地理解我在学习过程中的优点和需要改进的地方。我也将设定一些具体的、可衡量的目标，以便我可以跟踪我的进度。最后，我计划寻找一个导师或者加入一个专业网络，以便我可以从他人的经验中学习并获得反馈。我相信，通过这些努力，我将能够在我的专业领域中取得显著的进步。

模版推荐

作者其他创作

大纲/内容

 npm

网址

docs.npmjs.com

是什么

npm是一个node包管理和分发工具，已经成为了非官方的发布node模块（包）的标准。有了npm，可以很快的找到特定服务要使用的包，进行下载、安装以及管理已经安装的包。

常用指令

清除

$ clear

查看当前目录下已安装的node包

$ npm list

查看帮助

$ npm help

访问npm的json文件

$ npm help json

自动打开一个package.json网页

查看npm使用的所有文件夹

$ npm help folders

发布一个npm包的时候，需要检验某个包名是否已存在

$ npm search packageName

会引导你创建一个package.json文件，包括名称、版本、作者这些信息等

$ npm init

查看当前包的安装路径

$ npm root

查看全局的包的安装路径

$ npm root -g

查看npm安装的版本

$npm -v

将安装包信息加入到生产阶段的依赖

npm install gulp --save-dev 或 npm install gulp -D

查看安装包的安装路径

$ npm root [-g]

npm config 管理npm的配置路径

npm config set <key> <value> [-g|--global] npm config get <key> npm config delete <key> npm config list npm config edit npm get <key> npm set <key> <value> [-g|--global]

整理

安装node包 $ npm install 将包安装到全局环境中： $ npm install -g 安装的同时，将信息写入package.json中： $ npm install –save 移除全局环境中的包： $ npm uninstall -g 移除指定目录的套件： $ cd /path/to/the/project $ npm uninstall 搜寻包： $ npm search 列出全局的包： $ npm ls -g 列出全局的包的详细信息： $ npm ls -gl 更新node模块： $ npm update -g 清理缓存： $ npm cache clean 会引导你创建一个package.json文件，包括名称、版本、作者这些信息等： $ npm init 查看当前目录下已安装的node包： $ npm list 查看帮助命令： $ npm help 查看当前包的安装路径： $ npm root 查看全局的包的安装路径： $ npm root -g 查看npm安装的版本： $ npm -v

安装node和下载npm

在Git Bush here 输入命令行

运行node

$ node -v

运行npm

$ npm

npm安装

$ sudo npm install npm -g

有问题

修复npm权限

在Git Bush here 输入命令行

xxx

$ ls -l

xxx

$ whoami

xxx

$ sudo chown your_user file.txt

$ ls -l

XXX

$ npm config get prefix

清除

$ clear

在本地安装npm包

输入命令行

XXX

$ npm install grunt-cli -g

XXXX

$ npm install lodash

XXX

$ ls

XXX

$ ls node_modules/

子主题

$ vi app.js

子主题

$ node app.js

子主题

$ vi package.json

less

less是一门css预处理语言，它扩充了css语言，增加了诸如变量、混合、函数等功能

less网站：less.bootcss.com

JS引入less.min.js

在link标签中rel属性的值为：stylesheet/less     href属性的值为：xxx.less

less语法学习

less支持所有的css语法

less支持多行和单行注释，单行注释不会编译到css文件

css只支持多行注释

less有变量概念

声明变量

@变量名:值;

声明一个变量可以在复用

使用变量

选择器{样式:@变量名;}

less支持边变量的混入

选择器1{样式；}

选择器2{选择器1；样式；}

会被译为

选择器1{样式1}

选择器1  选择器2{样式2}

less可执行变量的操作

加/减/乘/除/取余

Less为样式提供了几十个可用的函数

ceil( )  floor( )  percentage( 5/10 )   // 50%  round( )  lighten(@c,  20%)   颜色变淡指定的百分比  darken(@c,  30%)   颜色变暗指定的百分比  ....

Less支持文件包含指令

Less也提供了@import指令，可用于包含其它的Less文件，推荐使用！—— Less的文件包含是在服务器端执行的文件拼合，客户端的一次请求就可以获得所有样式

通过修改Bootstrap的Less源文件实现定制

定制目标：

(1)Bootstrap瘦身，删除不必要的样式

注释掉bootstrap.less中不需要的@import即可

(2)修改Boostrap默认的样式值，实现粗粒度定制

修改variables.less中变量的值即可

(3)修改Boostrap组件的细节样式，实现细粒度定制

修改特定的组件对应的.less文件，如dropdown.less

输入命令行

安装

$ npm install -g less

调用less编译器

$ lessc styles.less

输出重定向到一个文件

$ lessc styles.less > styles.css

git知识点1

学习网站：www.liaoxuefeng.com

分布式版本控制系统

git安装后名，输入命令行

$ git config --global user.name "your name"

$ git config --global user.email "xxx@xxx.com"

创建仓库(repository)

安装git

 $ git

创建仓库的时候，需选择一个合适的地方，创建一个空目录

$ mkdir learngit

$ cd learngit

$pwd

会显示所在的路径

通过git init命令把这个目录变成git可以管理的仓库(初始化一个git仓库)

$ git init

瞬间将空的一个仓库建好，这是git跟踪管理仓库的，不要乱改

如果你没有看到仓库，那么仓库的隐藏的，可以用指令看见

$ ls -ah

把文件添加到仓库

在learngit目录下新建一个readme.txt文件

添加自定义内容

注意：windows自带的记事本运行不出来

添加文佳到git仓库，分两步

$ git add filel.txt

使用这个命令，告诉git,把文件添加到仓库

$ git commit -m "xxx"

-m输入的是本次提交的说明

使用这个命令告诉git,把文件提交到仓库

修改文件

随时掌握仓库的状态

$ git status

查看修改内容

$ git diff

版本回退

HEAD指向的版本就是当前版本，git 允许在版本的历史中穿梭

$ git reset --hard commit_id

穿梭前，用 $ git log 查看提交历史，以便确认回退到哪个版本 

要返回未来，用git reflog查看命令历史

图片解释

工作区:learngit文件夹

版本库：Respository

工作区有一个隐藏目录.git，就是版本库

版本库最重要的就是stage暂存区

git自动创建第一个分支master

以及指向master的一个指针HEAD

git add命令实际上就是把要提交的所有修改放到暂存区（stage）

执行 git commit就可以一次性把暂存区的所有修改提交到分支master

一旦提交后，工作区就是干净的

丢掉工作区的修改

$ git checkout --files.txt

两种情况

1.修改后还没有被放入暂存区

2.已经加入到暂存区，又做了修改

用$ git reset HEAD file  也可以将暂存区的修改撤销掉，重新放回工作区

适用场景:当你不但改乱了工作区某个文件的内容，还添加了暂存区时，用这个命令

查看工作区文档内容

$ cat files.txt

删除文件

$ git rm files.txt

工作区和版本库就不一致了，再用git commit就可以了

误删时一键还原

 $ git checkout -- files.txt

git知识点2

远程仓库

注册github,就可以免费获得git远程仓库

由于本地的git仓库和 github仓库之间的传输是通过SSH加密的，所以需要设置

第1步

创建SSH Key

在用户主目录下，看看有没有.ssh目录，如果有，再看看这个目录下有没有id_rsa和id_rsa.pub这两个文件，如果已经有了，可直接跳到下一步

如果没有，打开Shell（Windows下打开Git Bash），创建SSH Key：

$ ssh-keygen -t rsa -C "youremail@example.com"

如果一切顺利的话，可以在用户主目录里找到.ssh目录，里面有id_rsa和id_rsa.pub两个文件，这两个就是SSH Key的秘钥对，id_rsa是私钥，不能泄露出去，id_rsa.pub是公钥，可以放心地告诉任何人。

第2步

登陆GitHub，打开“Account settings”，“SSH Keys”页面：

然后，点“Add SSH Key”，填上任意Title，在Key文本框里粘贴id_rsa.pub文件的内容：

点“Add Key”，你就应该看到已经添加的Key：

为什么GitHub需要SSH Key呢？因为GitHub需要识别出你推送的提交确实是你推送的，而不是别人冒充的，而Git支持SSH协议，所以，GitHub只要知道了你的公钥，就可以确认只有你自己才能推送。

添加远程库

现在的情景是，你已经在本地创建了一个Git仓库后，又想在GitHub创建一个Git仓库，并且让这两个仓库进行远程同步，这样，GitHub上的仓库既可以作为备份，又可以让其他人通过该仓库来协作，真是一举多得。

首先，登陆GitHub，然后，在右上角找到“Create a new repo”按钮，创建一个新的仓库：

在Repository name填入learngit，其他保持默认设置，点击“Create repository”按钮，就成功地创建了一个新的Git仓库：

目前，在GitHub上的这个learngit仓库还是空的，GitHub告诉我们，可以从这个仓库克隆出新的仓库，也可以把一个已有的本地仓库与之关联，然后，把本地仓库的内容推送到GitHub仓库。 现在，我们根据GitHub的提示，在本地的learngit仓库下运行命令：

$ git remote add origin git@github.com:michaelliao/learngit.git

请千万注意，把上面的michaelliao替换成你自己的GitHub账户名，否则，你在本地关联的就是我的远程库

把本地的所有内容推送到远程库上

$ git push -u origin master

把本地库的内容推送到远程，用git push命令，实际上是把当前分支master推送到远程。 由于远程库是空的，我们第一次推送master分支时，加上了-u参数，Git不但会把本地的master分支内容推送的远程新的master分支，还会把本地的master分支和远程的master分支关联起来，在以后的推送或者拉取时就可以简化命令。 推送成功后，可以立刻在GitHub页面中看到远程库的内容已经和本地一模一样：

以后再提交不用加-u

从远程克隆

要克隆一个仓库，首先必须知道仓库的地址，然后使用git clone命令克隆。 Git支持多种协议，包括https，但通过ssh支持的原生git协议速度最快。

git最终整理

我们先看对git操作的简单分类，如下—— 远程仓库类：git clone/remote/pull/push/rebase/fetch 分支类（包括tag）：git branch/tag/checkout/stash 信息查阅：git status/log/diff 本地常规操作：git add/commit/rm/merge/reset

按照如下四个步骤上传到名为:flexSupplement的仓库中     git init (初始化本地仓库)      git add .  （将本地所有文件加到仓库里）      git commit -m "message" （设置提交信息）      git remote add origin   git@github.com:sunningcarryhaha/flexSupplement.git（本地仓库链接远程仓库）      git push -u origin master （push文件到仓库中） 上传成功后是这个效果 作者：carryhug 链接：https://www.zhihu.com/question/24156818/answer/111450498 来源：知乎 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

vueJS框架的学习

是一套构建用户界面的渐进式框架

自底向上增加开发的设计

核心库只关注视图层

安装：$ npm install vue

安装全局 vue-cli

$ npm install --global vue-cli

创建一个基于webpack模板的新项目

$ vue init webpack my-project

安装依赖

$cd my-project

$npm install

$npm run dev

语法

两种绑定方式

<div id="app">   {{ message }} </div>

var app = new Vue({   el: '#app',   data: {     message: 'Hello Vue!'   } })

<div id="app-2">       鼠标悬停几秒钟查看此处动态绑定的提示信息！   </div>

var app2 = new Vue({   el: '#app-2',   data: {     message: '页面加载于 ' + new Date()   } })

vuejs的核心：是一个允许采用简洁的模板语法声明式的将数据渲染进DOM

条件与循环

条件

<div id="app-3">   现在你看到我了 </div>

循环

var app3 = new Vue({   el: '#app-3',   data: {     seen: true   } })

seen:false

效果就看不到了

常用学习网站

less中文网

http://lesscss.cn/

iView

https://www.iviewui.com/components/upload

效果源代码网站

http://www.swiper.com.cn

axios文档

https://github.com/mzabriskie/axios

ECMAScript6

http://es6.ruanyifeng.com/

github

<a href="https://github.com/waylau/books-collection">https://github.com/waylau/books-collection</a>

vue文件介绍

 http://www.tuicool.com/articles/mYVvmyA

ECMAScript6语法

const<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">的作用域与<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>let</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">命令相同：只在声明所在的块级作用域内有效。

const<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">声明的常量，也与<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>let</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">一样不可重复声明。

声明变量

ES6除了添加let和const命令，后面章节还会提到，另外两种声明变量的方法：import命令和class命令。

var<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">命令和<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>function</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">命令声明的全局变量，依旧是顶层对象的属性；

var a=1; window.a  //1

注意：如果在Node的REPL环境，可以写成global.a           或者采用通用方法，写成this.a

let<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">命令、<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>const</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">命令、<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>class</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">命令声明的全局变量，不属于顶层对象的属性

let b=1; window.b  //underfined

解构（为变量赋值）

foo<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">是匹配的模式，<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>baz</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">才是变量。真正被赋值的是变量<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>baz</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">，而不是模式<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>foo</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">。

解构（为变量赋值）

1.数组的解构赋值

<pre class=" language-javascript" style='overflow: auto; font-family: Consolas, Monaco, "Andale Mono", monospace; font-size: 15.36px; color: rgb(255, 255, 255); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: 0px; word-break: normal; tab-size: 4; hyphens: none; padding: 10px 1em 10px 0.7rem; margin: 0.5em auto; border-radius: 5px; background: rgb(17, 17, 17); line-height: 1.2; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'><code class=" language-javascript" style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(166, 226, 46); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; tab-size: 4; hyphens: none; font-weight: normal; background: rgb(17, 17, 17); border-radius: 2px;'>let [foo, [[bar], baz]] = [1, [[2], 3]]; foo // 1 bar // 2 baz // 3 let [ , , third] = ["foo", "bar", "baz"]; third // "baz" let [x, , y] = [1, 2, 3]; x // 1 y // 3 let [head, ...tail] = [1, 2, 3, 4]; head // 1 tail // [2, 3, 4] let [x, y, ...z] = ['a']; x // "a" y // undefined z // []</code></pre>

2.对象的解构赋值

3.字符串的解构赋值

4.数值和布尔值的解构赋值

5.函数参数的解构赋值

注意：可以使用圆括号的情况

对unicode码的处理

codePointAt<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">方法返回的是码点的十进制值，如果想要十六进制的值，可以使用<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>toString</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">方法转换一下

对正则表达式的处理

<pre style="background-color:#2b2b2b;color:#a9b7c6;font-family:'宋体';font-size:12.0pt;">const reg = /^[0-9A-Za-z]{6,20}$/;</pre>

数值的扩展

1.二进制和八进制的表示法

2.Number.isFinite(),Number.isNaN()

Number.isFinite()<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">用来检查一个数值是否为有限的（finite）。

Number.isNaN()<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">用来检查一个值是否为<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>NaN</code>

3.Number.parseInt(),Number.parseFloat()

4.Number.isInteger()

Number.isInteger()<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">用来判断一个值是否为整数。需要注意的是，在JavaScript内部，整数和浮点数是同样的储存方法，所以3和3.0被视为同一个值。

5.Number.EPSILON

6.安全整数和Number.isSafeInteger()

7.Math对象的扩展

Math.trunc<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">方法用于去除一个数的小数部分，返回整数部分。

Math.sign<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">方法用来判断一个数到底是正数、负数、还是零。

Math.cbrt<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">方法用于计算一个数的立方根。

Math.clz32<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">方法返回一个数的32位无符号整数形式有多少个前导0。

数组的扩展

1.Array.from()

将类数组对象和可遍历的对象转为真正的数组

2.Array.of()

Array.of<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">方法用于将一组值，转换为数组

3.数组实例copyWithin()

 4.数组实例的find()和findindex()

5.数组实例的fill()

fill<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">方法使用给定值，填充一个数组。

6.数组实例的entries(),keys()和values()

<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">ES6提供三个新的方法——<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>entries()</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">，<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>keys()</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">和<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>values()</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">——用于遍历数组.<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">唯一的区别是<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>keys()</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">是对键名的遍历、<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>values()</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">是对键值的遍历，<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>entries()</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">是对键值对的遍历。

<pre class=" language-javascript" style='overflow: auto; font-family: Consolas, Monaco, "Andale Mono", monospace; font-size: 15.36px; color: rgb(255, 255, 255); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: 0px; word-break: normal; tab-size: 4; hyphens: none; padding: 10px 1em 10px 0.7rem; margin: 0.5em auto; border-radius: 5px; background: rgb(17, 17, 17); line-height: 1.2; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'><code class=" language-javascript" style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(166, 226, 46); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; tab-size: 4; hyphens: none; font-weight: normal; background: rgb(17, 17, 17); border-radius: 2px;'>for (let index of ['a', 'b'].keys()) { console.log(index); } // 0 // 1 for (let elem of ['a', 'b'].values()) { console.log(elem); } // 'a' // 'b' for (let [index, elem] of ['a', 'b'].entries()) { console.log(index, elem); } // 0 "a" // 1 "b"</code></pre>

7.数组实例的includes()

Array.prototype.includes<span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">方法返回一个布尔值，表示某个数组是否包含给定的值，与字符串的<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'>includes</code><span style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">方法类似

8.数组的空位

<p style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;"><code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px;'>Array.from</code>方法会将数组的空位，转为<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px;'>undefined</code>，也就是说，这个方法不会忽略空位。<pre class=" language-javascript" style='overflow: auto; font-family: Consolas, Monaco, "Andale Mono", monospace; font-size: 15.36px; color: rgb(255, 255, 255); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: 0px; word-break: normal; tab-size: 4; hyphens: none; padding: 10px 1em 10px 0.7rem; margin: 0.5em auto; border-radius: 5px; background: rgb(17, 17, 17); line-height: 1.2; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'><code class=" language-javascript" style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(166, 226, 46); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; tab-size: 4; hyphens: none; font-weight: normal; background: rgb(17, 17, 17); border-radius: 2px;'>Array.from(['a',,'b']) // [ "a", undefined, "b" ] </code></pre><p style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">扩展运算符（<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px;'>...</code>）也会将空位转为<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px;'>undefined</code>。<pre class=" language-javascript" style='overflow: auto; font-family: Consolas, Monaco, "Andale Mono", monospace; font-size: 15.36px; color: rgb(255, 255, 255); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: 0px; word-break: normal; tab-size: 4; hyphens: none; padding: 10px 1em 10px 0.7rem; margin: 0.5em auto; border-radius: 5px; background: rgb(17, 17, 17); line-height: 1.2; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'><code class=" language-javascript" style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(166, 226, 46); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; tab-size: 4; hyphens: none; font-weight: normal; background: rgb(17, 17, 17); border-radius: 2px;'>[...['a',,'b']] // [ "a", undefined, "b" ] </code></pre><p style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;"><code style='background: rgb(249, 242, 244); border-radius: 2px; color: rgb(199, 37, 78); padding-right: 3px; padding-left: 3px; font-family: Consolas,"Courier New",Courier,FreeMono,monospace; font-weight: normal;'>copyWithin()</code>会连空位一起拷贝。<pre class=" language-javascript" style='overflow: auto; font-family: Consolas, Monaco, "Andale Mono", monospace; font-size: 15.36px; color: rgb(255, 255, 255); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: 0px; word-break: normal; tab-size: 4; hyphens: none; padding: 10px 1em 10px 0.7rem; margin: 0.5em auto; border-radius: 5px; background: rgb(17, 17, 17); line-height: 1.2; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'><code class=" language-javascript" style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(166, 226, 46); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; tab-size: 4; hyphens: none; font-weight: normal; background: rgb(17, 17, 17); border-radius: 2px;'>[,'a','b',,].copyWithin(2,0) // [,"a",,"a"] </code></pre><p style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;"><code style='background: rgb(249, 242, 244); border-radius: 2px; color: rgb(199, 37, 78); padding-right: 3px; padding-left: 3px; font-family: Consolas,"Courier New",Courier,FreeMono,monospace; font-weight: normal;'>fill()</code>会将空位视为正常的数组位置。<pre class=" language-javascript" style='overflow: auto; font-family: Consolas, Monaco, "Andale Mono", monospace; font-size: 15.36px; color: rgb(255, 255, 255); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: 0px; word-break: normal; tab-size: 4; hyphens: none; padding: 10px 1em 10px 0.7rem; margin: 0.5em auto; border-radius: 5px; background: rgb(17, 17, 17); line-height: 1.2; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'><code class=" language-javascript" style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(166, 226, 46); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; tab-size: 4; hyphens: none; font-weight: normal; background: rgb(17, 17, 17); border-radius: 2px;'>new Array(3).fill('a') // ["a","a","a"] </code></pre><p style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;"><code style='background: rgb(249, 242, 244); border-radius: 2px; color: rgb(199, 37, 78); padding-right: 3px; padding-left: 3px; font-family: Consolas,"Courier New",Courier,FreeMono,monospace; font-weight: normal;'>for...of</code>循环也会遍历空位。<pre class=" language-javascript" style='overflow: auto; font-family: Consolas, Monaco, "Andale Mono", monospace; font-size: 15.36px; color: rgb(255, 255, 255); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: 0px; word-break: normal; tab-size: 4; hyphens: none; padding: 10px 1em 10px 0.7rem; margin: 0.5em auto; border-radius: 5px; background: rgb(17, 17, 17); line-height: 1.2; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'><code class=" language-javascript" style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(166, 226, 46); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; tab-size: 4; hyphens: none; font-weight: normal; background: rgb(17, 17, 17); border-radius: 2px;'>let arr = [, ,]; for (let i of arr) { console.log(1); } // 1 // 1 </code></pre><p style="color: rgb(51, 51, 51); font-family: Verdana, Arial; font-size: 15.36px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">上面代码中，数组<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px;'>arr</code>有两个空位，<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px;'>for...of</code>并没有忽略它们。如果改成<code style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(199, 37, 78); font-weight: normal; background: rgb(249, 242, 244); border-radius: 2px; padding-left: 3px; padding-right: 3px;'>map</code>方法遍历，空位是会跳过的。

函数的扩展

2.rest参数

3.扩展运算符

替代数组的apply方法

扩展字符串的应用

 1.合并数组

<pre class=" language-javascript" style='overflow: auto; font-family: Consolas, Monaco, "Andale Mono", monospace; font-size: 15.36px; color: rgb(255, 255, 255); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: 0px; word-break: normal; tab-size: 4; hyphens: none; padding: 10px 1em 10px 0.7rem; margin: 0.5em auto; border-radius: 5px; background: rgb(17, 17, 17); line-height: 1.2; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;'><code class=" language-javascript" style='font-family: Consolas, "Courier New", Courier, FreeMono, monospace; font-size: 0.7rem; color: rgb(166, 226, 46); text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; tab-size: 4; hyphens: none; font-weight: normal; background: rgb(17, 17, 17); border-radius: 2px;'>// ES5 [1, 2].concat(more) // ES6 [1, 2, ...more] var arr1 = ['a', 'b']; var arr2 = ['c']; var arr3 = ['d', 'e']; // ES5的合并数组 arr1.concat(arr2, arr3); // [ 'a', 'b', 'c', 'd', 'e' ] // ES6的合并数组 [...arr1, ...arr2, ...arr3] // [ 'a', 'b', 'c', 'd', 'e' ]、</code></pre>

2.与解构赋值结合

3.函数的返回值

4.字符串

5.实现了Iterator接口的对象

6.Map和Set结构，Generator函数

4.严格模式

5.name属性

6.箭头函数

注意