web-dev-qa-db-ja.com

JavaScriptで複数の変数を宣言する

関数で複数の変数を宣言したい：

function foo() {
    var src_arr     = new Array();
    var caption_arr = new Array();
    var fav_arr     = new Array();
    var hidden_arr  = new Array();
}

これはこれを行う正しい方法ですか？

var src_arr = caption_arr = fav_arr = hidden_arr = new Array();
javascriptvariablesdeclare
38
FFish

はい、それはすべてをメモリ内の同じオブジェクトを指すようにする場合ですが、1つが変化しても他のオブジェクトが影響を受けないように、それらを個別の配列にすることが最も可能性があります。

それらすべてが同じオブジェクトを指すようにしたくない場合は、

var one = [], two = [];

[]は、配列を作成するための省略表記です。

違いを示すコンソールログは次のとおりです。

>> one = two = [];
[]
>> one.Push(1)
1
>> one
[1]
>> two
[1]
>> one = [], two = [];
[]
>> one.Push(1)
1
>> one
[1]
>> two
[]

最初の部分では、メモリ内の同じオブジェクト/配列を指すようにoneとtwoを定義しました。 .Pushメソッドは配列に1をプッシュするため、oneとtwoの両方に1内側。 2番目の例では、変数ごとに一意の配列を定義したので、1にプッシュしても2は影響を受けませんでした。

76
meder omuraliev

すべての変数が同じオブジェクトを指すようにしたい場合でも、その割り当てパターンから遠ざけてください。

実際、最初のものだけが変数宣言になり、残りはおそらく未宣言の識別子への代入です！

宣言されていない識別子への値の割り当て（別名宣言されていない割り当て）は、識別子がスコープチェーンに見つからない場合、GLOBAL変数が作成されます。例えば：

function test() {
    // We intend these to be local variables of 'test'.
    var foo = bar = baz = xxx = 5;
    typeof foo; // "number", while inside 'test'.
}
test();

// Testing in the global scope. test's variables no longer exist.
typeof foo; // "undefined", As desired, but,
typeof bar; // "number", BAD!, leaked to the global scope.
typeof baz; // "number"
typeof xxx; // "number"

さらに、ECMAScript 5th Strict Modeは、この種の割り当てを許可しません。厳密モードでは、宣言されていない識別子に割り当てを行うと、暗黙のグローバルを防ぐためにTypeError例外が発生します。

対照的に、正しく記述されている場合は次のようになります。

function test() {
    // We correctly declare these to be local variables inside 'test'.
    var foo, bar, baz, xxx;
    foo = bar = baz = xxx = 5;
}
test();

// Testing in the global scope. test's variables no longer exist.
typeof foo; // "undefined"
typeof bar; // "undefined"
typeof baz; // "undefined"
typeof xxx; // "undefined"
18
CMS

いいえ、2番目のステートメントは、同じ配列への4つの参照を作成します。あなたが欲しい：

var src_arr     = [],
    caption_arr = [],
    fav_arr     = [],
    hidden_arr  = [];
1
hvgotcodes

すべての意図と目的のためにliteral []表記構文を使用する必要があります。 Arrayコンストラクターは、パラメーターの処理方法があいまいであるためです。

ドキュメントから：

Arrayコンストラクターに渡される唯一の引数が0〜232-1（両端を含む）の間の整数である場合、これは、長さプロパティがその数に設定された新しいJavaScript配列を返します。そして、それはArray値を持つ空のスロットの渡された長さのundefinedを意味します。

new Array(1, 2, 3); // Result: [1, 2, 3]
new Array(3); // Result: [empty × 3] with undefined at indexes
new Array('3') // Result: ['3']

//this was ambiguous
let x = new Array(5); // Result: [empty × 5]
x.Push("Hello"); //expected x as ["Hello", empty, empty, empty, empty]
//Actual x: [empty × 5, "Hello"]

破壊構文：

複数の変数を宣言するもう1つのきちんとした方法は、配列からの値またはオブジェクトからのプロパティを個別の変数にアンパックできるようにする destructuring assignment を使用することです。

function foo() {
  //destructuring assignment syntax
  let [src_arr, caption_arr, fav_arr, hidden_arr] = [[], [], [], []];

  console.info("Variables::", fav_arr, hidden_arr, caption_arr, src_arr);

  fav_arr.Push("fav");
  hidden_arr.Push("hidden");

  //After adding some values to couple of arrays
  console.info("Variables::", fav_arr, hidden_arr, caption_arr, src_arr);
}

foo();
0
ambianBeing

これらの変数はすべて、1つのArrayオブジェクトを参照します。

0
heximal