「速習ECMAScript」読んだ

速習ECMAScript6: 次世代の標準JavaScriptを今すぐマスター!

速習ECMAScript6: 次世代の標準JavaScriptを今すぐマスター!

ES6 をざっと知るには良かった。250円だし。


「[4] Polifilライブラリを有効化する」 はPolyfill ね。

Promise は使えそう。

function hoge(v) {
  return new Promise((res, reject) => {
    setTimeout(() => {
      if (v) {
        res(`値は ${v}`);
      } else {
        reject('入力値が空です');
      }
    }, 2000) ;
  });
}

hoge('金木研').then(
  res => { console.log(res) },
  error => { console.log(error) }
);

hoge().then(
  res => { console.log(res) },
  error => { console.log(error) }
);

hoge('有馬貴将')
  .then(
    response => {
      console.log(`1. ${response}`);
      return hoge('鈴屋什造');
    }
  )
  .then(
    response => {
      console.log(`2. ${response}`);
    },
    error => {
      console.log(`Error. ${error}`);
    }
  );

Promise.all([
  hoge('有馬貴将'),
  hoge('金木研'),
  hoge('神代利世')
])
  .then(
    response => {
      console.log(response);
    },
    error => {
      console.log(`Error. ${error}`);
    }
  );

Promise.race([
  hoge('霧島董香'),
  hoge('西尾錦'),
  hoge('功善')
])
  .then(
    response => {
      console.log(response);
    },
    error => {
      console.log(`Error. ${error}`);
    }
  );

console.log('Start');

Proxy を使うにはちょっと下準備が必要。Babel 本体では対応しないらしいので、plugin にて。

% npm i - babel-plugin-proxy babel-transform-runtime

.babelrc は以下のように plugins の設定を追加。

{
  "presets": ["es2015"],
  "plugins": ["proxy", "transform-runtime"]
}

Class の import、export についてはまだあまりわかっていないので、もうちょっと勉強の必要がある。

  • Figure.js
export default class Figure {
  static triangle(base, height) {
    return base * height / 2;
  }

  static circle(radius) {
    return Math.pow(radius, 2) / Math.PI;
  }
}
  • main.js
import Figure from "./Figure";

console.log(Figure.triangle(10, 5)); // => 25
console.log(Figure.circle(5)); // => 7.957747154594767

とりあえずは基本を学んだということで、次からは Angular2 を勉強していく。