プロトタイプからメソッドを拾う場合の手法

Question

JavaScriptを書いていると、以下のような場面で、標準オブジェクトのプロトタイプからメソッドを引っ張ってくる必要が生じます。

• 「配列のようなオブジェクト」にArrayのメソッドを使う
• 任意のオブジェクトを受け取れる場面で、Objectのメソッドを確実に使う
• Object.prototype.toStringでオブジェクトの分類を行う

このような場合、どう書くのがいいとお考えでしょうか。

var obj = new SomethingLikeArray();
var arr;

//その1：ふつうにプロトタイプを参照
arr = Array.prototype.slice.call(obj);

//その2：空の配列から抽出
arr = [].slice.call(obj);

//その3：事前に変数代入
var slice = Array.prototype.slice;
arr = slice.call(obj);

Answer 1

-「配列のようなオブジェクト」にArrayのメソッドを使う

呼び出しが1回なら Array.prototype.slice を使い、複数回なら Array.prototype.slice をローカル変数にキャッシュして使います。
[].slice は配列生成コストも無駄ですが、一度直属のプロパティを参照してからプロトタイプ上のプロパティ走査するので初めからプロトタイプ上のプロパティを指定した方が良いと考えます。
また、「配列のようなオブジェクト」に対して一回だけ Array.prototype なメソッドを使うならば、配列変換コストが無駄なので Array.orototype.slice を省略し、Array.prototype.forEach.call(arrayLike) のように使います。

グローバル変数の呼び出しコストが高いので基本的にはクロージャに閉じ込めてスコープチェーン上のコストが高くないように工夫します。

/**
 * toArray: 配列に変換する(ES3互換)
 */
var toArray = (function (isArray, slice) {
  if (typeof isArray !== 'function') {
    isArray = (function (Object, toString) {  // Array.isArray polyfill
      return function isArray (arg) {

        if (Object(arg) !== arg) {
          return false;
        }

        if (toString.call(arg) === '[object Array]') {
          return true;
        }
        return false;
      };
    }(Object, Object.prototype.toString));
  }

  return function toArray (arg) {
    return isArray(arg) ? arg : slice.call(arg);
  };
}(Array.isArray, Array.prototype.slice));

console.log(toArray({0: 1, 1: 2, 2: 3, length: 3})); // [1, 2, 3]

「配列のようなコンストラクタ」が拡張可能であれば、prototype に配列メソッドを入れます。

function SomethingLikeArray () { ; }
SomethingLikeArray.prototype.slice = Array.prototype.slice;
new SomethingLikeArray().slice();

• 任意のオブジェクトを受け取れる場面で、Objectのメソッドを確実に使う

Object.prototype.hasOwnProperty.call(arg) のように指定します。

• Object.prototype.toStringでオブジェクトの分類を行う

Object.prototype.toString.call(new RegExp) === '[object RegExp]' のようにして使いますが、これに関しては何を疑問に思っておられるのかわかりませんでした。
使い方を承知の上で質問しているようにも思いますが…。

Answer 2

目的のコンストラクタがArrayを継承する、という方法はどうでしょうか。

var SomethingLikeArray = function() {
  // ...
};

SomethingLikeArray.prototype = Object.create(Array.prototype);
SomethingLikeArray.prototype.constructor = SomethingLikeArray;

// 以下よりメソッド定義

/**
 * @override
 */
SomethingLikeArray.prototype.toString = function() {
  // 独自のtoString
  return 'SomethingLikeArray';
};

この方法ですと、Arrayの機能を持った自前のオブジェクトを定義することが可能です。

var obj = new SomethingLikeArray();
obj.push(100);
console.log(obj.toString()); // => SomethingLikeArray

Comments

[mozukichi]

本質問の主題が「プロトタイプからメソッドを拾う場合の手法」だったので、的はずれな回答だったかもしれません。

Answer 3

それがベストかはわからないですが、その1の書き方をよく使っています。
標準オブジェクトのメソッドを呼び出していることが明確にわかるためです。

他のひとはどうしているんでしょうか。私も興味あります。

Answer 4

ちょっとベンチしてみましたが、 当方の環境ではArray.prototype.slice.callの方がわずかに速かったです。おそらく[].sliceはインスタンスの生成コストがかかるのでは。

Answer 5

自分はその2をよく使ってますね。
短く書けるし、意外とイディオム的な感じで使えるのではないかな、と思っているので。