JavaScript >> Javascript チュートリアル >  >> Tags >> object

JavaScript で配列のようなオブジェクトを作成する

特にコンソールに依存します。 Chrome の開発者コンソールと Firebug のカスタム オブジェクトには、両方の length が必要です。 と splice プロパティ。 splice も関数である必要があります。

a = {
    length: 0,
    splice: function () {}
}
console.log(a); //[]

ただし、公式の標準がないことに注意することが重要です。

次のコードは、オブジェクトが for を使用する必要があるかどうかを判断するために jQuery (v1.11.1) によって内部的に使用されます。 ループまたは for..in ループ:

function isArraylike( obj ) {
    var length = obj.length,
        type = jQuery.type( obj );

    if ( type === "function" || jQuery.isWindow( obj ) ) {
        return false;
    }

    if ( obj.nodeType === 1 && length ) {
        return true;
    }

    return type === "array" || length === 0 ||
        typeof length === "number" && length > 0 && ( length - 1 ) in obj;
}

コンソールに配列として表示されるオブジェクトを持つことができることに注意してください ([] ) しかし、それは for..in で繰り返されます jQuery のループ、またはコンソールにオブジェクトとして表示されるオブジェクト ({} ) しかし、それは for で繰り返されます jQuery でループします。


arguments のような配列を使用できるのと同じ質問が頭に浮かびました パラメータ:

function arrayLike() {
  console.log(typeof arguments)
  console.log(arguments)
  console.log(Array.from(arguments))
}
arrayLike(1,2,3)

それでは、独自の配列のようなオブジェクトを作成してみましょう:

let arrayLikeObject = {
  0: 1,
  1: 2
 }
 
 console.log(Array.from(arrayLikeObject))

明らかに、長さプロパティが定義されていないため、arrayLikeObject 空の配列のみを返します。それでは、長さのプロパティを定義してみましょう:

let arrayLikeObject = {
  length: 2,
  0: 1,
  1: 2
 }
 
 console.log(Array.from(arrayLikeObject))

長さが異なって設定されている場合はどうなりますか?

let arrayLikeObject = {
  length: 1,
  0: 1,
  1: 2
 }
 
 console.log(Array.from(arrayLikeObject))
 // it will only return the value from first `0: 1`

let arrayLikeObject = {
  length: 5,
  0: 1,
  1: 2
 }
 
 console.log(Array.from(arrayLikeObject))
 // other 3 values will be printed as undefined

しかし、私はそれを変換したくありません...

実際には、配列のようなオブジェクトではなく、配列を作成したかったのです。配列のようなオブジェクトは、あなたが言ったように変換する必要があります:

Array.prototype.slice.call(arrayLikeObject)
// Or,
[].slice.call(arrayLikeObject)

配列のようなオブジェクトで配列メソッドを使用しようとすると、型エラーが発生します:

let arrayLikeObject = {
  length: 5,
  0: 1,
  1: 2
 }

 console.log(arrayLikeObject.sort())

したがって、arrayLikeObject で配列メソッドを使用するには、前の例で Array.from を使用して行ったように、配列に変換する必要があります。 .

それ以外の場合は、単に配列を作成する必要があります:

let arr = [1,2] // I don't mean, you don't know

その他の考慮事項:

コンストラクターとして使用することはできません:

let arrayLikeObject = {
    length: 1,
    slice: function () {
      return 1
    }
}

console.log(new arrayLikeObject) // Type error

次のスニペットでは、結果は [undefined] になります。 length プロパティは 1 に設定されていますが、0 はありません。 インデックス付きプロパティ:

let arrayLikeObject = {
  length: 1,
  slice: function () {
    return 1
  }
}
console.log(Array.from(arrayLikeObject))

しかし、長さを 0 に設定すると、結果は空の配列 [] になります。 この配列のようなオブジェクトには値がないと言っているからです。


これは何の役にも立ちますか:拡張配列プロトタイプ、彼はあなたが行ったことを実行し、プロトタイプを配列として作成しているようですが、追加のメソッドが含まれています (動作する場合と動作しない場合があります。これはテストしていません):

var MyArray = function() {
};

MyArray.prototype = new Array;

MyArray.prototype.forEach = function(action) {
    for (var i = 0, l=this.length; i < l, ++i) {
        action(this[i]);
    }
};

何らかの形で役立つことを願っています。


  1. 2019 年に参加すべき Node.js および JavaScript カンファレンス

  2. 最初にロードするときに、この特定の列でこのテーブルを並べ替えるにはどうすればよいですか?

  3. cssをマテリアライズ | js – カルーセル スライドの視覚化の問題