精读阮一峰 ECMAScript 6 入门 阶段3

深入学习了async await的实现，内部如何封装generator，其实就是一个同时实现了generator函数和它的自动执行器的函数，相当于语法糖。在某些使用场景大大简化了异步流程的操作。

print("hello")

var p=console.log
p("eool")

const paragraph = 'The quick brown fox jumps over the lazy dog. It barked.';
const regex = /[A-Z]/g;
const found = paragraph.match(regex);
console.log(found);

async function f() {
    return 'hello world';
  }
  
  f().then(v => console.log(v))

async function f() {
    throw new Error('出错了');
  }
  
  f().then(
    v => console.log('resolve', v),
    e => console.log('reject', e)
  )
const fetch=require('fetch');
async function getTitle(url) {
    let response = await fetch(url);
    let html = await response.text();
    return html.match(/<title>([\s\S]+)<\/title>/i)[1];
  }
  getTitle('https://tc39.github.io/ecma262/').then(console.log)

class Sleep {
    constructor(timeout) {
      this.timeout = timeout;
    }
    then(resolve, reject) {
      const startTime = Date.now();
      setTimeout(
        () => resolve(Date.now() - startTime),
        this.timeout
      );
    }
  }
  
  (async () => {
    const sleepTime = await new Sleep(1000);
    console.log(sleepTime);
  })();

function spawn(genF) {
    return new Promise(function(resolve, reject) {
      const gen = genF();
      function step(nextF) {
        let next;
        try {
          next = nextF();
        } catch(e) {
          return reject(e);
        }
        if(next.done) {
          return resolve(next.value);
        }
        Promise.resolve(next.value).then(function(v) {
          step(function() { return gen.next(v); });
        }, function(e) {
          step(function() { return gen.throw(e); });
        });
      }
      step(function() { return gen.next(undefined); });
    });
  }

function logInOrder(urls) {
    // 远程读取所有URL
    const textPromises = urls.map(url => {
      return fetch(url).then(response => response.text());
    });
  
    // 按次序输出
    textPromises.reduce((chain, textPromise) => {
      return chain.then(() => textPromise)
        .then(text => console.log(text));
    }, Promise.resolve());
  }

function Point(x, y) {
    this.x = x;
    this.y = y;
  }
  
  Point.prototype.toString = function () {
    return '(' + this.x + ', ' + this.y + ')';
  };
  
  var p = new Point(1, 2);

class B {
    constructor(x, y) {
        // ...
      }
    
      toString() {
        // ...
      }
}
const b = new B();

console.log(Object.keys(B.prototype));

console.log(Object.getOwnPropertyNames(B.prototype));

class Point {

    constructor(x, y) {
      this.x = x;
      this.y = y;
    }
  
    toString() {
      return '(' + this.x + ', ' + this.y + ')';
    }
  
  }
  
  var point = new Point(2, 3);
  
console.log(point.toString()); // (2, 3)
  
  point.hasOwnProperty('x') // true
  point.hasOwnProperty('y') // true
  point.hasOwnProperty('toString') // false

class CustomHTMLElement {
    constructor(element) {
      this.element = element;
    }
  
    get html() {
      return this.element.innerHTML;
    }
  
    set html(value) {
      this.element.innerHTML = value;
    }
  }
  
  var descriptor = Object.getOwnPropertyDescriptor(
    CustomHTMLElement.prototype, "html"
  );
  
  "get" in descriptor  // true
  "set" in descriptor  // true

let person = new class {
    constructor(name) {
      this.name = name;
    }
  
    sayName() {
      console.log(this.name);
    }
  }('张三');
  
  console.log(person.sayName());; // "张三"

class Point {}

class Foo {
    constructor(...args) {
      this.args = args;
    }
    * [Symbol.iterator]() {
      for (let arg of this.args) {
        yield arg;
      }
    }
  }
  
  for (let x of new Foo('hello', 'world')) {
    console.log(x);
  }

class Logger {
    printName(name = 'there') {
      this.print(`Hello ${name}`);
    }
  
    print(text) {
      console.log(text);
    }
  }

  const logger = new Logger();

  console.log(logger.printName());

function selfish (target) {
    const cache = new WeakMap();
    const handler = {
      get (target, key) {
        const value = Reflect.get(target, key);
        if (typeof value !== 'function') {
          return value;
        }
        if (!cache.has(value)) {
          cache.set(value, value.bind(target));
        }
        return cache.get(value);
      }
    };
    const proxy = new Proxy(target, handler);
    return proxy;
  }
  
  const logger = selfish(new Logger());

class Foo {
    static classMethod() {
      return 'hello';
    }
  }
  
  class Bar extends Foo {
  }
  
  console.log(Bar.classMethod()); // 'hello'

class MyClass {
    static myStaticProp = 42;
  
    constructor() {
      console.log(MyClass.myStaticProp); // 42
    }
  }

  new MyClass()

class FakeMath {
    static PI = 22 / 7;
    static #totallyRandomNumber = 4;
  
    static #computeRandomNumber() {
      return FakeMath.#totallyRandomNumber;
    }
  
    static random() {
      console.log('I heard you like random numbers…')
      return FakeMath.#computeRandomNumber();
    }
  }
  
  FakeMath.PI // 3.142857142857143
  FakeMath.random()
  // I heard you like random numbers…
  // 4
  FakeMath.#totallyRandomNumber // 报错
  FakeMath.#computeRandomNumber() // 报错

function Person(name) {
    if (new.target !== undefined) {
      this.name = name;
    } else {
      throw new Error('必须使用 new 命令生成实例');
    }
  }
  
  // 另一种写法
  function Person(name) {
    if (new.target === Person) {
      this.name = name;
    } else {
      throw new Error('必须使用 new 命令生成实例');
    }
  }
  
  var person = new Person('张三'); // 正确
  var notAPerson = Person.call(person, '张三');  // 报错

class Shape {
    constructor() {
      if (new.target === Shape) {
        throw new Error('本类不能实例化');
      }
    }
  }
  
  class Rectangle extends Shape {
    constructor(length, width) {
      super();
      // ...
    }
  }
  
  var x = new Shape();  // 报错
  var y = new Rectangle(3, 4);  // 正确