zoukankan      html  css  js  c++  java
  • es6语法

      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>
    

      

  • 相关阅读:
    win10 uwp 如何判断一个对象被移除
    win10 uwp 如何判断一个对象被移除
    上传代码 CodePlex
    上传代码 CodePlex
    如何使用 Q#
    让 AE 输出 MPEG
    让 AE 输出 MPEG
    解决 vs 出现Error MC3000 给定编码中的字符无效
    解决 vs 出现Error MC3000 给定编码中的字符无效
    PHP date_date_set() 函数
  • 原文地址:https://www.cnblogs.com/daemon-/p/8944404.html
Copyright © 2011-2022 走看看