タグ

ブックマーク / js-next.hatenablog.com (7)

  • テンプレートリテラルが実装された - JS.next

    概要 テンプレート文字列を記述できる構文が実装された。 テンプレートリテラル 基の使い方 バッククオート『 ` 』で囲んだ文字が、文字列リテラル同様に文字列として評価される。 var t = `テンプレート` var s = "テンプレート" console.log(t) // "テンプレート" console.log(t == s) // true 改行がそのまま認識される。 var t = `テンプ レート` var s = "テンプ\n"+ "レート" console.log(t) // "テンプ⏎レート\t" console.log(t == s) // true 文字列中に変数などを埋め込む リテラル中の『${』と『}』で囲まれた部分は式として評価される。 var n = 123, f = () => 339 var t = `0${ n }45${ f() * 2 }9` v

    テンプレートリテラルが実装された - JS.next
    yuiseki
    yuiseki 2014/11/22
  • superキーワードについて - JS.next

    概要 長らく予約語であったsuperキーワードが、継承元の関数を呼ぶためのキーワードとして機能するようになった。 2種類の使い方 superキーワードは場所によって2種類の使い方があり、それぞれ違う振る舞いをする。 1つ目はコンストラクタ内で使う場合、2つ目はメソッド内で使う場合である。 コンストラクタ内で使う場合 ここでいうコンストラクタとは、Class構文中のconstructorメソッドのことである。 この場合、「super()」や「new super」などとすることにより、その関数のプロトタイプである関数を呼ぶことができる。 そして、 呼び出し先が返した値が以後呼び出し元のthisとして使われる。 つまり、Animalコンストラクタを継承したCatコンストラクタを定義したい以下の例だと、 function Animal( name ) { this.name = name } fu

    superキーワードについて - JS.next
    yuiseki
    yuiseki 2014/11/01
  • Class構文について - JS.next

    概要 待ち焦がれた人も多いことだろう。ES2015の一番の目玉機能とも言えるクラス構文が、ついにV8でサポートされた。 Class構文は、『関数(コンストラクタ)定義』+『.prototypeへのメソッド定義』の糖衣構文である。 JSで今まで様々に工夫されてきたクラスの書き方を、綺麗に統一してくれる可能性を秘めている。 クラスを作る 従来、Catクラスを作ろうとした場合このように書いてきた。 function Cat(name) { this.name = name } Cat.prototype.meow = function () { alert( this.name + 'はミャオと鳴きました' ) } しかしこの書き方だとどうしても、コンストラクタとメソッドの定義が分離されているため、クラスとしてまとまりがなく分かりづらく感じる。 メソッドが増えてきた時も、Cat.prototyp

    Class構文について - JS.next
    yuiseki
    yuiseki 2014/11/01
  • アロー関数が実装された - JS.next

    概要 ES2015を象徴する機能である、アロー関数構文の実装がついにV8で始まった。 無名関数を短く書ける   [3.28.31] アロー関数は無名関数の省略記法である。 今までこう書いていたのが、 var fn = function (a, b) { } こうスッキリ書ける。 var fn = (a, b) => { } 「=>」が矢のように見えることから「アロー」関数と言う。 更に短くできる これが、 [1, 2, 3].map( function (v) { return v * v } ) // [1, 4, 9] アロー関数だとこうなるが、 [1, 2, 3].map( (v) => { return v * v } ) // [1, 4, 9] 引数が一つの時には「()」を省略できるので、こう書ける。 [1, 2, 3].map( v => { return v * v } )

    アロー関数が実装された - JS.next
    yuiseki
    yuiseki 2014/07/24
  • for文でのlet変数が毎ループ新スコープを持つようになった - JS.next

    概要 かつてはfor文初期化句で宣言された変数は、for文の直前で宣言されたように振舞っていたが、各ループでスコープを引きづらないように仕様が変更され、V8も追従した。 例 for (let i = 0; i < 5; i++) { ~~~ } これは今までは次のコードと等価だった。 { let i = 0 for (; i < 5; i++) { ~~~ } } つまりfor文中で関数を定義するとこうなっていた。 let funs = [] for (let i = 0; i < 5; i++) { funs.push(function () { return i }) } funs.map(function (fun) { return fun() }) // [5,5,5,5,5] この結果が[0,1,2,3,4]になるのが今回の変更である。 つまり一番最初のコードはこれと等価になる

    for文でのlet変数が毎ループ新スコープを持つようになった - JS.next
    yuiseki
    yuiseki 2014/05/31
  • Object.observeについて - JS.next

    概要 Object.observeとは、オブジェクトの変更を監視するためのAPIであった。 ES2015,2016の候補として挙げられており、V8でデフォルトで有効にされるまでに至っていたが、 実装コストがかかる上、世のニーズとそれほど合っていないということで結局廃止された。 改めて注意勧告 これは廃止された仕様です APIの概要 提供されるメソッド Object.observe(target, callback, acceptList = defaultAcceptTypes) // targetオブジェクトを監視する // 監視するオブジェクト、変更があった時に呼ばれる関数、監視するタイプの配列を指定する // defaultAcceptTypes = ['add', 'update', 'delete', 'setPrototype', // 'reconfigure', 'prev

    Object.observeについて - JS.next
    yuiseki
    yuiseki 2014/03/09
  • Promiseについて - JS.next

    概要 Promiseとは非同期処理を上手く扱う為のAPIであり、パターンである。 非同期の処理の完了後に続けて処理を行いたいとき、よくコールバックパターンが使われるが、処理が連続するとコールバック地獄と言われる分かりづらいソースコードになってしまう。 また、複数の非同期処理が完了した時に処理を行うなど、コールバックパターンでは難しい事をスマートにできるのがこのPromiseである。 今まではDOMの方でDOM Promiseとして仕様策定が進められていたり、ライブラリのDeferredが有名だったが、ES2015標準に入ることになり、V8に実装された。 実装されたメソッド Promise.resolve(x) Promise.reject(x) Promise.all( [p1, p2, p3, ......] ) Promise.race( [p1, p2, p3, ......] )

    Promiseについて - JS.next
  • 1