ES6语法是目前前端开发的基础,当然基本的JavaScript又是它的基础.
学习资源
【慕课网】 带你快速入坑ES 谢诚 写的ES新特性API在线电子书
第2章 ES6特性入坑
2-1 JS中可以声明常量吗 (15:32)
不允许重复声明
不属于顶层对象window
不存在变量提升
暂时性死区
块级作用域
2-2 const声明的常量真的不可以改变吗 (15:29)
2-3 函数有更简单的写法吗 (12:03)
核心:箭头函数中this的指向, 提到一个术语: 作用域链去寻找this所指的对象
2-4 箭头函数任何场景都可以使用吗 (12:18)
核心:箭头函数作为事件的一个回调函数时,this
2-5 取值有更优雅的方式吗 (09:41)
2-6 你能在项目中准确的使用解构赋值吗 (14:07)
//解构赋值语法,关键词 const const course = { name: 'es6', price: 500 } //等号左边和等号右边对应的结果要完全一样 const { name, price } = course; //优雅的取值赋值语法 //解构赋值语法应用,等号左边和右边是同一种结构 const sum = ([a,b,c]) => { console.log(a+b+c); }; sum([1,2,3]);
涉及: apply()
if (typeof option === 'string') methodReturn = data[ option ].apply(data, args);
//设计技巧:读作执行TwbsPagination对象(由小括号中data引用)的option方法, Math.max.apply(null, [14, 3, 77])
apply() 方法=调用一个具有给定this值的函数,以及以一个数组(或类数组对象)的形式提供的参数。
读作:由于 JavaScript 不提供求数组最大元素的函数,所以只能套用Math.max函数,将数组转为一个参数序列,然后求最大值。
Math.max() 参考 MDN Web Docs 官方权威API
//扩展延伸:浏览器的file协议,http协议
小结:解构赋值正确使用姿势
即ES6中正确使用解构赋值语法的
函数参数
函数返回值
变量互换(小技巧)
JSON应用
Ajax请求应用
2-7 ES6不能被所有浏览器解析怎么办 (14:48)
BABEL 工具的作用
构建环境:
1.安装nodeJS环境
2.创建项目目录 npm init -y 初始化package.json
3.安装需要的module npm install --save-dev babel-preset-env babel-cli //安装二个module 等价 小写的i 大写的-D //新版本的node支持
安装成功后会在package.json devDependences:属性下看到这二个包
4.创建文件并配置 .babelrc 没有文件名
里面写
{ "presets":["env"] }
BABEL进行文件转化
.文件: babel src/index.js -o dist/index.js
.文件夹: babel src -d dist
.实时监控: babel src -w -d dist //参数d
第3章 如何更好的学习ES
本章将回顾本门课程的学习内容,给出学习ES更多新特性的学习建议,提供ES新特性的学习文档。
3-1 如何更好的学习ES (09:26)