<!DOCTYPE HTML>
<html>
<head>
<title>测试es6</title>
</head>
<body>
<h2>欢迎来到es6</h2>
</body>
<script type="text/javascript">
//1.变量 let const
var a = 1;
{
let a = 3;
console.info('let a',a); //3
}
console.info('var a',a); //1
let b = 3;
//let b = 4; //Identifier 'b' has already been declared (在let定义的块级作用域内,不能对同一个变量名重复定义)
const A = 3;//变量一般大写,表示常量
//A = 4; //Assignment to constant variable.(const定义的常量不允许修改)
//const A = 4;//Identifier 'A' has already been declared (与let一样,作用域内是不允许重复定义的)
//2.for of forEach循环
{
let b = 'welcome use EcmaScript6';
b = b.split(' ');
for(var i of b){
console.log(i);//welcome use EcmaScript6
}
b.forEach(function(r){
console.log('forEach',r);
});
b.forEach(r => console.log('forEach => ',r));
}
//3.关于箭头函数
//函数的简写形式 (参数)=>函数体
var arrowFunction1 = function(){ //es5写法
return 'I`m a arrow function';
}
var arrowFunction2 = () => 'I`m a arrow function';//es6写法
console.info('arrowFunction:',arrowFunction1());
console.info('arrowFunction:',arrowFunction2());
let arr = ['a','b','c'];
arr.map((vari) => console.info('arrow return ',vari));
let getFinalPrice = (price, tax=0.7) => console.info(price + price * tax);
getFinalPrice(500); // 850
//解构
var [arrA,arrB,arrC] = arr; //按照顺序将数组的值赋给[]中的变量
console.log(arrA,arrB,arrC); //a,b,c
var [arrC,arrA] = arr;
console.log(arrA,arrC); //b,a
var a = 1,bb = 4;
[a,bb] = [bb,a];
console.log([a,bb])//4,1 可以用来交换数组,不用定义中间临时参数
//...操作符
//Spread操作 扩展
console.info(...[1,2,3,4]) //1 2 3 4
function foo(x,y,z){
console.log(x,y,z);
}
foo(...[1,2,3,4]);// 1 2 3
foo(...[{1:4},{2:3}]);//{1:4} {2:3}
//Rest操作 剩余
function boo(...args){
console.info(args);
}
boo(1,2,3,4,5,6)//[1, 2, 3, 4, 5, 6]
//`来组装一堆变量和字符串 ${}来替换变量
var str1 = 'XiaoMing';
console.info(`my name is ${str1}`);
//类 构造函数 继承(基于原型链)
class Car {
constructor() {
console.info('this is car');
}
move(){
console.info('moving');
}
}
var car1 = new Car();
car1.move();
class AutoCar extends Car{
constructor() {
super();
console.info('this is auto Car');
}
}
var autoCar = new AutoCar();
autoCar.move();
</script>
</html>
分享到:
相关推荐
非常简洁快速学习ECMAScript(JavaScript)的一本手册,没有漫长的讲解,只有关键的示例和说明,简单易学,看着不头疼……
Learning ECMAScript 6 Learning ECMAScript 6 Learning ECMAScript 6 Learning ECMAScript 6
ECMAScript 6 入门(第三版)
Understanding ECMAScript 6 中文版
阮一峰老师著作,最新版epub格式电子书,在线地址:http://es6.ruanyifeng.com/,请支持纸质正版
ECMAScript 6入门手册,ECMAScript 6入门手册,ECMAScript 6入门手册
这个pdf文件完整的整理了 ECMAScript 6 入门-阮一峰这一书,并进行了格式优化,适合查看和打印。
深入理解ECMAScript 6 (中文版和英文版javascript完整版),可以两版对比学习 Understanding ECMAScript 6:The definitive guide for Javascript developers 作者Nicholas C·Zakas曾编著JavaScript高级程序设计
ECMAScript 6 阮老师第三版,包含pdf,mobi,epub等格式,可以在iBooks, kindle, 支持PDF阅读的pc、平板和手机上直接阅读。
《ECMAScript 6入门》是一本开源的JavaScript语言教程,全面介绍ECMAScript 6新引入的语法特性。 本书力争覆盖ES6与ES5的所有不同之处,对涉及的语法知识给予详细介绍,并给出大量简洁易懂的示例代码。 本书为中级...
ECMAScript6 入门及环境搭建 node nvm 安装过程和图解示例
2018最新 高清 ECMAScript 6 入门 ES6 离线文档 官方 阮一峰
深度解析 ECMAScript 6 。本书为中级难度,适合已有一定 JavaScript 语言基础的读者,用来了解这门语言的最新发展;也可当作参考手。
Learning ECMAScript 6 英文无水印pdf pdf使用FoxitReader和PDF-XChangeViewer测试可以打开
ECMAScript 6入门 第二版 全内容, 适用于任何阶段学习者
ECMAScript 6 入门 文字 高清 清晰版 阮一峰 ES6 入门
ecmascript 6 入门.pdf 阮一峰著 在此分享 请不要用于商用 此pdf由于是生成的所以比较小,但是内容很全
《ECMAScript 6 入门》是一本开源的 JavaScript 语言教程,全面介绍 ECMAScript 6 新引入的语法特性。 本书覆盖 ES6 与上一个版本 ES5 的所有不同之处,对涉及的语法知识给予详细介绍,并给出大量简洁易懂的示例...
《ECMAScript6入门》全面介绍了ECMAScript6新引入的语法特性,覆盖了ECMAScript6与ECMAScript5的所有不同之处,对涉及的语法知识给予了详细介绍,并给出了大量简洁易懂的示例代码。, 《ECMAScript6入门》为中级难度...