node : 6 ES5/6的语法相关

1. about class

示例代码:

// 1. ES3
function Human(name, age){
    this.name = name;
    this.age = age;
}
Human.prototype.show = function(){ // 定义原型上的方法,以便所有的实例都可以访问
    console.log(this.name, this.age);
};
var h = new Human('lili', 18); // 创建一个Human的实例 
h.show(); // lili 18

// 2. ES3-5继承:通过原型进行继承。
// 此处略,详见JavaScript中级继承相关内容。

// 3. ES6中定义类型和继承的方式

// ES6中定义类型和构造函数:
// ps:类名要符合标识符的规范。
class Student{
    // 定义构造函数,如果构造函数未写,那么会自动添加一个默认的空的构造函数。constructor(){}
    constructor(name, age){
        this.name = name;
        this.age = age;
    }

    // 在类里定义的方法都是在原型上,注意:不可遍历。
    showStu(){
        console.log(this.name, this.age); 
    }
}

// 创建类型的实例,通过class定义的类型,必须通过new来构造实例。
let s = new Student('adrx', 12);
s.showStu(); // adrx 12

2. about set and get

// ES5中 get 和 set

function Stu(name){
    this._name = name; // 加了前下划线,表示想把它作为一个私有变量
}

Stu.prototype = {
    constructor: Stu,

    // get标记:表示这是一个属性
    get Name(){
        return this._name;
    },

    set Name(val){
        if(val){
            this._name = val;
        }
    }
};

var s = new Stu("lili");
console.log(s.Name); // lili
s.Name = '';
console.log(s.Name); // lili
s.Name = 'sfa';
console.log(s.Name); // sfa


// ES6中定义类型和构造函数:
// ps:类名要符合标识符的规范。
class Student{
    // 定义构造函数,如果构造函数未写,那么会自动添加一个默认的空的构造函数。constructor(){}
    constructor(name, age){
        this._name = name;
        this.age = age;
    }

    // 在类里定义的方法都是在原型上,注意:不可遍历。
    showStu(){
        console.log(this._name, this.age); 
    }

    get Name() {
        return this._name;
    }

    set Name(val) {
        this._name = val || ""; // 当用户设置为null时,这边处理为 给其赋值一个空字符串。
    }
}

// 创建类型的实例,通过class定义的类型,必须通过new来构造实例。
let s = new Student('adrx', 12);
s.showStu(); // adrx 12
console.log(s.Name); // adrx
s.Name = 'gire';
console.log(s.Name); // gire
s.Name = '';
console.log(s.Name);

3. inherit

// ES6
class Human {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }

    show() {
        console.log("name: %s, age: %d", this.name, this.age);
    }
}

class Student extends Human {
    constructor(name, age, classNum) {
        // 子類對象的構建需要通過父類執行構造函數的構建過程
        super(name, age); // 調用父類的構造函數 (子類必須調用父類的構造函數)
        
        // 子類自己設置自己的屬性
        this.classNum = classNum;
    }

    stuShow(){
        console.log("name: %s, age: %d, classNum: %s", this.name, this.age, this.classNum);
    }
}

let s = new Student('adf', 12, '056');
s.stuShow(); // name: adf, age: 12, classNum: 056
s.show(); // name: adf, age: 12

 

4. 箭头函数

参数 => 函数体

示例代码:

// 參數 => 函數體

// 一個參數
var f = a => ++a;
console.log(f(1));  // 2

// 多個參數
var f = (a, b) => a + b;
console.log(f(1, 2)); // 3

// 多條語句的時候 ({}裡是語句塊)
var sum = (num1, num2) => {
    ++num1;
    ++num2;
    return num1+num2;
};
console.log(sum(1,2)); // 5

var t = ()=>{
    console.log(this); // 此處的this 就是定義箭頭函數作用域裡的this。且這個this固定。
};
t(); // {}


// 示例demo
let add = function(a, b){
    return a + b;
};
console.log(add(4, 5)); // 9

let addArrowFunc = (a, b) => a + b;
console.log(addArrowFunc(3, 4)); // 7

var arr = [3, 1, 5, 3];
arr.sort((a, b)=> a-b);
console.log(arr); // [ 1, 3, 3, 5 ]

ps:

  1. 函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。
  2. 不可以当做构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。
  3. 不可以使用arguments对象,该对象在函数体内不存在,如果要用,可以用rest参数代替。
  4. 不可以使用yield命令,因此箭头函数不能用作Generator函数。
  5. 箭头函数不能用bind绑定this。

 

5. #region #endregin

将一段代码进行折叠:

6.展开运算符

展开运算符 :  “...”

发布了191 篇原创文章 · 获赞 1 · 访问量 4689

猜你喜欢

转载自blog.csdn.net/bluebloodye/article/details/103169497