javascriptの仕組みと未来のjavascript ~esnextとは~
Post on 16-Apr-2017
818 Views
Preview:
TRANSCRIPT
JavaScript の仕組みと 未来の JavaScript〜 ESNext とは〜
console.log(hello);
JavaScript は、最初はただの文字列(テキストファイルなど)です。
JavaScriptおれが JavaScript だー!
console.log(hello);
hello
この文字列を JavaScript エンジンに食べさせることでプログラムとして動きます。
JavaScriptエンジンJavaScript
V8 Nitro SpiderMonkey
Chakra
GoogleChrome Safari FireFox Edge/IE
各ブラウザはそれぞれJavaScript エンジンを持っています。
だからブラウザは JavaScript を動かすことができるのです。
詳しく⤴
V8 Chakra
ただ、 JavaScript エンジンがそれぞれ違うのでちょっぴり表現の仕方が違ったりすることもあります。
hello hello
JavaScript
せつないね。。
でも各社好き勝手に作ったわけではありません。JavaScript はこう動くべきだ!という仕様書があり、これを元に JavaScript が動くように作られています。
仕様書
ふむ なるほな こうか ?
ECMAScript
( 仕様書)
それが ECMAScript (えくますくりぷと)、略して ES です。
ECMAScript
ver.1ver.2ver.3ver.4 もめ過ぎて破棄ver.5ver.6 → ver.2015 数え方を変更ver.2016ver.2017 作成中
この ECMAScript は、時代とともに新しくなってきました。ver.6 からは毎年新しくするよ!っていう意気込みで
数え方を西暦に変更しました。つまり、毎年便利な機能が増え続けているのです。
もっと詳しく⤴ 詳しく⤴
ECMAScript はどんどん増えていきますが、各エンジンはすぐには追いけていない状況です。
だから便利な機能は、まだ使えないことが多いのです。
ECMAScript
ちょま ふぇー なんと ? ??
詳しく⤴
ECMAScript ESNext = 未来の JavaScript
この、まだ実質使えないものも含めた、来年出る最新の ECMAScript のバージョンをESNext と呼びます。(今だと 2017 がそれ)
来年版
便利な ESNext でプログラムを書きたい。。でも動かない。。。
そこですごい人は考えました。『一番安定してどのブラウザでも動く ES5 に変換すればい
い!』
そうして造られたのが Babel という変形屋さん。(トランスパイラといいます)
ESNext( 未来の JavaScript)
ES5へいおまちー
直接は無理でも、変形屋さんを通すことで、私たちは未来の JavaScript をすぐに使えるようになりました。
ESNext( 未来の JavaScript) ES5
hello🙅 🙆Error
へいおまちー
未来はこの手の中に
お粗末様でした。動かし方や変換の仕方はまた別の機会に。
フォント: 東青梅ゴシックC⤴ こども丸ゴシック⤴ 鉄瓶ゴシック⤴ ゆずポップ⤴
いらすと: いらすとや⤴
素材
top related