es6语法
程序员文章站
2022-07-26 17:19:15
es6又称为es2015,为javascript的一个重要标准,至今并没有被所有浏览器兼容 ......
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>
上一篇: 多线程之生产者消费者模型