ECMAScript6學習筆記

CODING 發布于2019-08-21 10:47 / 1102人閱讀

摘要：筆記和和是塊作用域的，是聲明常量用的。一個對象如果要有可被循環調用的接口，就必須在的屬性上部署遍歷器生成方法原型鏈上的對象具有該方法也可。這種方式會訪問注冊表，其中存儲了已經存在的一系列。這種方式與通過定義的獨立不同，注冊表中的是共享的。

ECMAScript6 筆記 let 和 const

let和const是塊作用域的，const是聲明常量用的。

{let a = 10;}
a // ReferenceError: a is not defined.

let和const不存在變量提升

console.log(foo); // ReferenceError
let foo = 2;

var tmp = 123;
if (true) {
  tmp = "abc"; // ReferenceError
  let tmp;
}

function bar(x = y, y = 2) {
  return [x, y];
}
bar(); // 報錯

const 不可變的只是引用的地址

const foo = {};
foo.prop = 123;
foo.prop// 123
foo = {} // TypeError: "foo" is read-only不起作用

如果真的想將對象凍結，應該使用Object.freeze方法。

const foo = Object.freeze({});
foo.prop = 123; // 不起作用

class

class Point {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }
    static classMethod() {
        console.log("fathor jt:hello");
    }
}
class ColorPoint extends Point { //mix(Cons1,Cons2)
    constructor(x, y, color) {
        super(x, y);
        this.color = color; // 正確
    }
    //原型方法
    ptMethod(){
        console.log("pt:hello");
    }
    static classMethod() {
        //靜態方法也是可以從super對象上調用
        super.classMethod();
        console.log("jt:hello");
    }
    get prop() {
        return "getter";
    }
    set prop(value) {
        console.log("setter: "+value);
    }
}

Iterator和for...of循環

Iterator的作用有三個：一是為各種數據結構，提供一個統一的、簡便的訪問接口；二是使得數據結構的成員能夠按某種次序排列；三是ES6創造了一種新的遍歷命令for...of循環，Iterator接口主要供for...of消費。

let arr = ["a", "b"];
let iter = arr[Symbol.iterator]();
iter.next() //{ value: "a", done: false }
iter.next() //{ value: "b", done: false }
iter.next() //{ value: undefined, done: true }

上面代碼中，變量arr是一個數組，原生就具有遍歷器接口，部署在arr的Symbol.iterator屬性上面。所以，調用這個屬性，就得到遍歷器對象。

一個對象如果要有可被for...of循環調用的Iterator接口，就必須在Symbol.iterator的屬性上部署遍歷器生成方法（原型鏈上的對象具有該方法也可）。

class RangeIterator {
  constructor(start, stop) {
    this.value = start;
    this.stop = stop;
  }
  [Symbol.iterator]() { return this; }
  next() {
    var value = this.value;
    if (value < this.stop) {
      this.value++;
      return {done: false, value: value};
    } else {
      return {done: true, value: undefined};
    }
  }
}
for (var value of new RangeIterator(0, 3)) {
  console.log(value);
}

Symbol

ES6引入了一種新的原始數據類型Symbol，表示獨一無二的值。它是JavaScript語言的第七種數據類型，前六種是：Undefined、Null、布爾值（Boolean）、字符串（String）、數值（Number）、對象（Object）。

symbol鍵的設計初衷是避免初衷，因此JavaScript中最常見的對象檢查的特性會忽略symbol鍵。例如，for-in循環只會遍歷對象的字符串鍵，symbol鍵直接跳過，Object.keys(obj)和Object.getOwnPropertyNames(obj)也是一樣。但是symbols也不完全是私有的：用新的API Object.getOwnPropertySymbols(obj)就可以列出對象的symbol鍵。另一個新的API，Reflect.ownKeys(obj)，會同時返回字符串鍵和symbol鍵。（我們將在隨后的文章中講解Reflect(反射) API）

獲取symbol的三種方法

調用Symbol()。這種方式每次調用都會返回一個新的唯一symbol。

調用Symbol.for(string)。這種方式會訪問symbol注冊表，其中存儲了已經存在的一系列symbol。這種方式與通過Symbol()定義的獨立symbol不同，symbol注冊表中的symbol是共享的。如果你連續三十次調用Symbol.for("cat")，每次都會返回相同的symbol。注冊表非常有用，在多個web頁面或同一個web頁面的多個模塊中經常需要共享一個symbol。

使用標準定義的symbol，例如：Symbol.iterator

var s1 = Symbol();
var s2 = Symbol();
s1 === s2 // false

var mySymbol = Symbol();
var a = {
  [mySymbol]: "Hello!"
};

promie 生成器 Generators 集合 箭頭函數

箭頭函數提供了更簡潔的語法，并且箭頭函數中 this 對象的指向是不變的，this 對象綁定定義時所在的對象

// bad
"use strict";
var fn = function fn(v) {
  return console.log(v);
};

// good
var fn= (v=>console.log(v));

Module Babel下的ES6兼容性與規范

http://imweb.io/topic/561f9352883ae3ed25e400f5?utm_source=tuicool&utm_medium=referral

GPU云服務器云服務器學習筆記學習筆記一基礎學習筆記深度學習筆記

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/86190.html

Vue.js新手入門指南[轉載]

摘要：就是一個用于搭建類似于網頁版知乎這種表單項繁多，且內容需要根據用戶的操作進行修改的網頁版應用。單頁應用程序顧名思義，單頁應用一般指的就是一個頁面就是應用，當然也可以是一個子應用，比如說知乎的一個頁面就可以視為一個子應用。最近在逛各大網站，論壇，以及像SegmentFault等編程問答社區，發現Vue.js異常火爆，重復性的提問和內容也很多，樓主自己也趁著這個大前端的熱潮，著手學習了一...

MartinHan 2019-08-23 11:50 評論0 收藏0
前端補集 - 收藏集 - 掘金

摘要：原文地址一個非常適合入門學習的博客項目前端掘金一個非常適合入門學習的項目，代碼清晰結構合理新聞前端掘金介紹一個由編寫的新聞。深入淺出讀書筆記知乎專欄前端專欄前端掘金去年的一篇老文章，恰好今天專欄開通，遷移過來。破解前端面試（80% 應聘者不及格系列）：從閉包說起 - 掘金修訂說明：發布《80% 應聘者都不及格的 JS 面試題》之后，全網閱讀量超過 6W，在知乎、掘金、cnodejs ...

YorkChen 2019-08-29 12:41 評論0 收藏0
前端補集 - 收藏集 - 掘金

摘要：原文地址一個非常適合入門學習的博客項目前端掘金一個非常適合入門學習的項目，代碼清晰結構合理新聞前端掘金介紹一個由編寫的新聞。深入淺出讀書筆記知乎專欄前端專欄前端掘金去年的一篇老文章，恰好今天專欄開通，遷移過來。破解前端面試（80% 應聘者不及格系列）：從閉包說起 - 掘金修訂說明：發布《80% 應聘者都不及格的 JS 面試題》之后，全網閱讀量超過 6W，在知乎、掘金、cnodejs ...

AbnerMing 2019-08-20 16:57 評論0 收藏0
ES6學習摘要（01）（新人學習）

摘要：入門一前言由于最近本人在學習，做一些筆記能夠更好的熟悉，就趁此機會來寫一篇關于的新人學習摘要吧。的作用域與命令相同只在聲明所在的塊級作用域內有效。塊級作用域新增方式和實際上為新增了塊級作用域。同時，函數聲明還會提升到所在的塊級作用域的頭部。 ECMAScript6/ES6 入門一、前言由于最近本人在學習ES6，做一些筆記能夠更好的熟悉，就趁此機會來寫一篇關于ES6的新人學習摘要吧。...

dmlllll 2019-08-21 17:59 評論0 收藏0
常用ECMAScript6語法歸納

摘要：對象的解構賦值函數執行后，返回的是一個對象。分別取出對象中屬性為和的值，根據解構賦值的規則，在左側聲明變量，放在大括號中，變量名要和屬性名保持一致。箭頭函數在中，箭頭函數就是函數的一種簡寫形式允許使用箭頭定義函數。原文博客地址，歡迎學習交流:點擊預覽聲明變量可以使用let、const關鍵字聲明變量，而不推薦使用var聲明變量 var聲明變量的問題：可以多次重復聲明同一個變量...

raledong 2019-08-22 15:14 評論0 收藏0