es6又称为es2015,为javascript的一个重要标准,至今并没有被所有浏览器兼容
<script>
/**
* let,用于解决javascript中无块级作用域
*/
{
let a = "test";
}
//console.log(a); // Uncaught ReferenceError: is not defined
/**
* const,也是块级作用域,解决javascript中无常量
*/
{
const a = "test";
//a = "123"; // Uncaught TypeError: Assignment to constant variable.
const b = {name:"tom", age:18};
b.age = 13;
console.log(b); // {name: "tom", age: 13} 不能改变本身的值,但可以改变其引用的值
}
/**
* 箭头函数,javascript中函数的语法糖, 简化了函数的书写
*/
{
let a = function (m, n) {
return m+n;
}
console.log(a(1, 2)); // 3
a = (m, n) => m+n;
console.log(a(1, 2)); // 3
}
/**
* 箭头函数中this的指向
*/
{
let people = {
walk: function () {
console.log(this); // people
},
walkIn: function () {
setTimeout(function () {
console.log("walkIn");
console.log(this); // window
}, 100);
},
walkInArrow: function () {
setTimeout(() => {
console.log("walkInArrow");
console.log(this); // people
}, 200)
},
walkInArrow2: () => {
setTimeout(() => {
console.log("walkInArrow2");
console.log(this); // window
}, 300)
}
}
people.walk();
people.walkIn();
people.walkInArrow();
people.walkInArrow2();
}
/**
* 函数参数默认值
*/
{
let fun1 = function (value) {
value = value || "defaultValue";
console.log(value);
}
fun1(123); // 123
fun1(); // defaultValue
fun1 = function (value="defaultValue") {
console.log(value);
}
fun1(123); // 123
fun1(); // defaultValue
}
/**
* 装箱与拆箱
*/
{
let fun1 = function (...args) {
for (let arg of args){
console.log(arg);
}
}
fun1(1, 2, 3); // 1 2 3
fun1 = function (x, y, z) {
return x+y+z;
}
console.log(fun1(...[1, 2, 3])); // 6
let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let arr3 = [...arr1, ...arr2];
console.log(arr3); // [1, 2, 3, 4, 5, 6]
}
/**
* 解构赋值
*/
{
let [name, age, sex] = ["tom", 18, "male"];
console.log("name="+name+", age="+age+", sex="+sex); // name=tom, age=18, sex=male
let {name: name2, age: age2, sex: sex2} = {name: "alice", age: 20, sex: "female"};
console.log("name2="+name2+", age2="+age2+", sex2="+sex2); // name=alice, age=20, sex=female
}
/**
* 字符串拼接
*/
{
let name = 'tom';
let sex = 'male';
let age = 18;
console.log(`name=${name}, sex=${sex}, age=${age}`); // name=tom, sex=male, age=18
}
/**
* 类
*/
class Animal{
constructor(name, age){
this.name = name;
this.age = age;
}
self_introduce(){
console.log(`My name is ${this.name}, and I'm ${this.age} years old.`);
}
static getClassName(){
return "Animal";
}
}
{
let animal = new Animal('tom', 18);
animal.self_introduce(); // My name is tom, and I'm 18 years old.
console.log(Animal.getClassName()); // Animal
}
class People extends Animal{
constructor(name, age, language){
super(name, age)
this.language = language;
}
self_introduce(){
super.self_introduce();
console.log(`And I speak ${this.language}.`);
}
}
{
let people = new People("alice", 20, "chinese");
people.self_introduce(); // My name is alice, and I'm 20 years old.
// And I speak chinese.
}
</script>