明示的な末尾呼び出し最適化構文が実装された - JS.next
概要 ES2015で特定の形で関数呼び出しがされている場合に末尾呼び出し最適化が行われるよう定められたが、 パフォーマンスや、デバッグなどの実装上の問題が浮上したため、それを解決するための新たな構文がV8で実装されたが、その後廃止された 説明 具体的には、strictモードの是非を問わず、「 return continue fn() 」という形での呼び出しについて最適化が有効になる。 （詳細は明示的でない末尾呼び出し最適化の記事をご覧ください） 最適化が効く例： function fn( n ) { 'use strict' if ( n <= 0 ) { return 'done!' } return continue fn( n - 1 ) } fn( 1e6 ) // "done!" 最適化が効かない例： function fn( n ) { 'use strict' if ( n
Function#nameについて - JS.next
概要 ES2015からは名前の無い関数定義であっても、コンテキストによって関数のnameプロパティが定義されるようになった。 nameプロパティが定義される例 直接的な変数への代入 f1 = function () {} var f2 = function () {} let f3 = () => {} const f4 = () => {} console.log( f1.name, f2.name, f3.name, f4.name ) // "f1" "f2" "f3" "f4" 直接的なプロパティ定義 o = { m1: function () {}, ['m2']: () => {}, m3() {} } console.log( o.m1.name, o.m2.name, o.m3.name ) // "m1" "m2" "m3" nameプロパティが定義されない例 間接的なケ
べき乗演算子が実装された - JS.next
概要 Math.pow関数の代わりに新しい演算子「 ** 」でべき乗の演算ができるようになった。 例 これが n = Math.pow(3, 2) console.log(n) // 9 n = Math.pow(n, 2) console.log(n) // 81 こう書ける n = 3 ** 2 console.log(n) // 9 n **= 2 console.log(n) // 81 問題 これはどうなるだろうか？ console.log( - 3 ** 2 ) 答えは『 SyntaxError 』である。 「 - 3 ** 2 」は「 (- 3) ** 2 」と「 - (3 ** 2) 」のどちらで評価されるか予想しづらい。 それは他の単項演算子についても言えるので、べき乗演算子の左辺に単項演算子が用いられた式を置くことは禁止されている。 そのため、左辺に単項マイナス演算子を
@@hasInstanceが実装された - JS.next
概要 インスタンスであるか判定するためのビルトインシンボルが実装された。 解説 instanceof演算子が「 obj instanceof C 」の形で使われると、「 C[@@hasInstance] 」が定義されていた場合objを引数に呼ばれ、それが返す真偽値が返される。 class X { } class A { static [Symbol.hasInstance](obj) { return obj.constructor == X } } let a = new A, x = new X console.log( a instanceof A ) // false console.log( x instanceof A ) // true ちょっと変わった利用例 型判定に使う const StringOrNumber = { [Symbol.hasInstance](v) {
@@speciesが実装された - JS.next
概要 クラスの種族を設定するためのビルトインシンボルが実装された。 解説 例えば、ArrayのサブクラスであるMyArrayを定義し、そのインスタンスmyaryを作ったとき、 myary.map()はArrayではなくMyArrayのインスタンスを返して欲しいと通常思うだろう。 そうしたケースに応えるため、幾つかのビルトインメソッドはconstructorの@@speciesプロパティを見ることで インスタンスの種族コンストラクタを知り、それを使うようになっている。 とは言え、ビルトインコンストラクタに定義されている@@speciesゲッタはサブクラスを返す挙動をするため、 殆どの場合ではわざわざ自前サブクラスに@@speciesを定義しないで、スーパークラス側のそれを使わせればよい。 もしmyary.map()の結果がMyArrayではないものであって欲しいと思う場合には、定義することで
Proxyについて - JS.next
概要 Proxyを使うとオブジェクトに対する様々な操作に割り込み、好きな振る舞いをさせることが出来る。 記事更新履歴 [2016/03/23] ES2016でenumerateトラップが削除されるのに対応 [2015/12/02] 公開 APIの概要 提供されるメソッド new Proxy( target<Object>, handler<Object> ) -> <Proxy> // targetオブジェクトを基盤としたプロキシを作る // プロキシへの操作を受ける関数を入れたhandlerオブジェクトを指定する Proxy.revocable ( target<Object>, handler<Object> ) -> { proxy<Proxy>, revoke<Function> } // 無効化可能なプロキシをproxyプロパティに持ち、 // 無効化するためのrevokeメソッ
SharedArrayBufferとAtomics APIについて - JS.next
概要 JSで大きな処理を効率良く捌きたい時、今までもWorker等でスレッド立てて処理を分割する事はできたが、 スレッド間のやり取りの方法は制限されたものしかなく、バッファを共有することもできなかった。 そこで新しく導入されたSharedArrayBufferを用いると、スレッド間で共同利用できるバッファを作る事ができる。 記事更新履歴 ※この記事はV8が仕様の新しいバージョンを実装するのに合わせて断続的に更新していきます。 [2016/07/19] V8の半年ぶりの新仕様追従に対応 [2015/09/30] 公開 通常のArrayBufferとの比較 前準備： // メッセージを受け取ると渡された型付配列のインデックス0を123にするWorker w = new Worker(URL.createObjectURL(new Blob([` self.onmessage = e => {
@@toPrimitiveが実装された - JS.next
概要 オブジェクトがプリミティブ型に変換される際に、どんな処理を行いどんな値を返すか決めるためのビルトインシンボルが実装された。 解説 JavaScriptでは様々な場合で様々にオブジェクトがプリミティブ型に変換される。 例えば「Number(obj)」や「String(obj)」とすると、それぞれ数値型と文字列型が期待され、 通常それぞれオブジェクトの「valueOf」メソッドと「toString」メソッドが呼び出されることになる。 一方、例えば加算演算子「+」で評価されるとき、両辺の値はまずプリミティブ型に変換されるが、これには期待される型はない。 そのような時、殆どのオブジェクトは「valueOf」メソッドが呼ばれるが、Dateオブジェクトは「toString」メソッドが呼ばれるという特殊な振る舞いをする。 そのようにオブジェクトがプリミティブ型に変換されるときの振る舞いを制御したい
SIMD型について - JS.next
概要 新しいプリミティブ型であるSIMD型及びAPIがV8で実装されてきている。 SIMDとは、複数の数値を並べて１つの値としたようなデータ型である。 これはCPUによって効率良くサポートされているデータ型であり、 1 + 2 -> 3 をするように [ 1, 2, 3, 4 ] + [ 2, 3, 4, 5 ] -> [ 3, 5, 7, 9 ] を1回の演算ですることができる。 つまり、沢山の数値を扱う場面でSIMD型を利用することで、何倍ものパフォーマンス向上が期待できる。 （※WASMに入ることとなり、ESからは一旦取り除かれました。） 実装される型 float32x4 32bit浮動小数点型を4つ並べた128bitのデータ型 float32はJSの通常のnumberであるところのfloat64より精度が低い int32x4 32bit符号付き整数型を4つ並べた128bitのデータ
Array.{of, from}が実装された - JS.next
概要 配列を作る２つのArrayのスタティックメソッドが実装された。 Array.from(arrayLike, mapfn?, thisArg?) 配列のようなものから配列を作る便利なメソッド。 例 DOMに配列のメソッドを適応したい時、 今までは [].slice.call(document.getElementsByTagNames('p')).map(mapfn, thisArg) これがこう書ける Array.from(document.getElementsByTagNames('p'), mapfn, thisArg) 外部参考リンク Firefox 32 で Array.from が実装された - hogehoge @teramako Array.of(...items) 引数から配列を作るメソッド。 例 Array.of(1) // [1] Array.of(1, 2,
new.targetメタプロパティについて - JS.next
概要 「new.target」とは、ES2015で導入されたビルトインクラスのサブクラスを作る上で欠かせない存在である[[newTarget]]を取得するためのメタプロパティである。 従来の問題点 ES5まではArrayのようなビルトインクラスを適切に継承したサブクラスを作ることができなかった。 ES2015からのプロトタイプ設定機能を使うと可能であり、このようになる。 class Stack extends Array { constructor( ...args ) { var stack = new Array( ...args ) return Object.setPrototypeOf( stack, Stack.prototype ) } clear() { this.length = 0 } } しかし毎回このように書かないといけないのはスマートではない。 できればこの様に書
Reflect APIが実装された - JS.next
概要 Reflectオブジェクトはグローバルに存在し、演算子がするような作用や、内部的に行われているような作用をメソッドの形で提供する。 記事更新履歴 [2016/03/23] ES2016でenumerateトラップが削除されるのに対応 [2015/03/24] 公開 実装されたメソッド Reflect.has ( target, key ) [4.8.9] 「 key in target 」とほぼ同じ*1。 Reflect.get ( target, key, receiver? ) [4.8.9] 「 target[ key ] 」とほぼ同じ*1だが、オプションでゲッターのthisとなるreceiverを指定できる。 Reflect.set ( target, key, value, receiver? ) [4.8.187] 「 target[ key = value ] 」
Class構文について - JS.next
概要 待ち焦がれた人も多いことだろう。ES2015の一番の目玉機能とも言えるクラス構文が、ついにV8でサポートされた。 Class構文は、『関数（コンストラクタ）定義』＋『.prototypeへのメソッド定義』の糖衣構文である。 JSで今まで様々に工夫されてきたクラスの書き方を、綺麗に統一してくれる可能性を秘めている。 クラスを作る 従来、Catクラスを作ろうとした場合このように書いてきた。 function Cat(name) { this.name = name } Cat.prototype.meow = function () { alert( this.name + 'はミャオと鳴きました' ) } しかしこの書き方だとどうしても、コンストラクタとメソッドの定義が分離されているため、クラスとしてまとまりがなく分かりづらく感じる。 メソッドが増えてきた時も、Cat.prototyp
@@toStringTagが実装された - JS.next
概要 例えば『Object.prototype.toString.call([])』と呼ぶと、『"[object Array]"』と帰ってくるが、 その「Array」の部分をどういう表記にするか設定できるビルトインシンボルが実装された。 例 function Cat() { } var cat = new Cat console.log( '' + cat ) // "[object Object]" Cat.prototype[Symbol.toStringTag] = 'Cat' console.log( '' + cat ) // "[object Cat]" 一部のビルドインコンストラクタには@@toStringTagが定義されている。 console.log( Map.prototype[Symbol.toStringTag] ) // "Map" 実装されるバージョン V8 3
@@unscopablesが実装された - JS.next
概要 with文に与えたオブジェクトの特定のプロパティがスコープに含まれることを防ぐための、 ビルトイン"unscopables"シンボルが実装された。 例 @@unscopablesプロパティのオブジェクトが有する名前のプロパティは、値がTruthyならスコープから外される。 var a = 'unscopable', b = 'unscopable', c = 'unscopable' var obj = { a: 'scopable', b: 'scopable', c: 'scopable', } obj[Symbol.unscopables] = { b: true, c: false } with (obj) { console.log(a, b, c) } /* log "scopable" "unscopable" "scopable" */ 何故必要なのか ES2015で
アロー関数が実装された - 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
概要 V8でES2015のイテレーション周りの実装が進んできたので、解説してみようと思う。 イテレーションとは ここではデータの要素を繰り返して取り出すこと。 例えば配列のforEachメソッドは、要素やインデックスをイテレートするイテレータである。 ただしこれらは（内部的に）繰り返しまで行うイテレータ（内部イテレータ）だが、ES2015では外部イテレーションのための仕組みが入った。 イテレータオブジェクト イテレータオブジェクトは『次の要素』を返すメソッドを備えているオブジェクトである。 つまりイテレーションの『次の要素を取り出す』ことだけを担い、それを繰り返すことは外で行われる（外部イテレータ）。 例 Array.prototype.values()は配列の要素を順番に列挙するイテレータオブジェクトを返す。 var ary = [5, 4, 3] var iter = ary.valu
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
Symbolについて - JS.next
概要 ES2015ではUndefined、Null、Boolean、Number、String、Objectの６つの型に加えて、新しい型Symbolが導入された。 シンボルはプリミティブ型で、文字列のようにプロパティのキーとして使える特徴を持つ。 振る舞い シンボルはSymbolコンストラクタを呼ぶことで作られ、その時に引数として文字列を渡せば名前を持たせることができる。 sym1 = Symbol() sym2 = Symbol('name') typeof演算子で評価すると"symbol"が返される。 typeof sym1 // "symbol" Symbolコンストラクタをnew付きで呼び出すことは出来ないが、シンボルをObjectコンストラクタに渡すことでラップすることはできる。 new Symbol() // TypeError symobj = Object(sym2) ty
Object.setPrototypeOfが実装された - JS.next
実装されたメソッド Object.setPrototypeOf(target, proto) targetオブジェクトのプロトタイプをprotoに設定する 返り値はtargetで、protoはオブジェクトまたはnullである必要がある 解説 ES5で導入された Object.getPrototypeOf のセット版である。 これにより __proto__ を使わなくても動的にプロトタイプをセットできるようになった。 例 オブジェクトに配列のメソッドを継承させる arrayLike = { length: 3, 0: 'a', 1: 'b', 2: 'c' } arrayLike.forEach // undefined Object.setPrototypeOf(arrayLike, Array.prototype) // 『Array.prototype』をarrayLikeの『プロトタ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
