108

わかりましたので、私は Nodes でプロジェクトに取り組んでいます。オブジェクト リテラルのキーに関する小さな問題に遭遇しました。次の設定があります。

var required = {
    directories : {
        this.applicationPath                    : "Application " + this.application + " does not exists",
        this.applicationPath + "/configs"       : "Application config folder does not exists",
        this.applicationPath + "/controllers"   : "Application controllers folder does not exists",
        this.applicationPath + "/public"        : "Application public folder does not exists",
        this.applicationPath + "/views"         : "Application views folder does not exists"
    },
    files : {
        this.applicationPath + "/init.js"               : "Application init.js file does not exists",
        this.applicationPath + "/controllers/index.js"  : "Application index.js controller file does not exists",
        this.applicationPath + "/configs/application.js": "Application configs/application.js file does not exists",
        this.applicationPath + "/configs/server.js"     : "Application configs/server.js file does not exists"
    }
}

多くの人がこれを見て大丈夫だと思うでしょうが、コンパイラは私が:(コロン) を欠いている+と言い続けてい.ます。

オブジェクトリテラルはコンパイル時に作成され、実行時でthis.applicationPathはなく、連結などの動的変数が使用できないことを意味します:( :(

大量のコードを書き直すことなく、このような障害を克服する最善の方法は何ですか?

4

8 に答える 8

194

計算されたプロパティ名は、ECMAScript2015 でサポートされています。

var name = 'key';
var value = 'value';
var o = {
  [name]: value
};
alert("o as json : " + JSON.stringify(o));

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer

于 2016-08-04T18:01:36.450 に答える
109

ECMAScript 2015 (ed 6) より前では、オブジェクト リテラル (ECMAScript では「オブジェクト初期化子」と呼ばれます) キーは次のいずれかである必要があります。

  1. 識別子名
  2. 文字列リテラル
  3. NumericLiteral

そのため、式をイニシャライザのキーとして使用できませんでした。これは ECMAScript 2015 で変更されました (以下を参照)。プロパティにアクセスするために角括弧表記の式を使用できます。

var required = { directories : {}};
required.directories[this.applicationPath] = "Application " + this.application + " does not exists";
required.directories[this.applicationPath + "/configs"] = "Application config folder does not exists";
...

等々。は頻繁に再利用されるためthis.applicationPath、参照を保存してパフォーマンスを向上させ、コード量を削減することをお勧めします。

var a = this.applicationPath;
var required = { directories : {}};
var rd = required.directories;
rd[a] = "Application " + this.application + " does not exists";
rd[a + "/configs"] = "Application config folder does not exists";
...

編集

ECMAScript 2015 (ed 6) の時点で、オブジェクト初期化子は以下を使用して計算されたキーを持つことができます。

[expression]: value

プロパティ名とメソッド名の短縮構文もあります。

MDN: オブジェクト初期化子またはECMAScript オブジェクト初期化子を参照してください。

于 2011-06-28T01:29:22.777 に答える
46

動的キーを設定するには、ブラケット表記を使用します。

required.directories[this.applicationPath + "/configs"] = "Application config folder does not exists";

(もちろん、この定義を行う場所にはthis.applicationPath必ず存在する必要があります)

this.applicationPathしかし、鍵が必要ですか？これらの値にどのようにアクセスしますか? this.applicationPathプロパティにアクセスするために使用する値から削除することができます。

ただし、必要な場合:

多くのコードを繰り返さないようにしたい場合は、配列を使用してキーを初期化できます。

var dirs = ['configs', 'controllers', ...];
var files = ['init.js', 'controllers/index.js', ...];

var required = { directories: {}, files: {} };
required.directories[this.applicationPath] = "Application " + this.application + " does not exists";

for(var i = dirs.length; i--;) {
    required.directories[this.applicationPath + '/' + dirs[i]] = "Application " + dirs[i] + " folder does not exists";
}

for(var i = files.length; i--;) {
    // same here
}
于 2011-06-28T01:27:07.990 に答える
8

babelが新しい ES6 構文 ( ) を古い Javascript に変換する方法に触発され{[expression]: value}て、1 つのライナーでそれを実行できることを学びました。

var obj = (_obj = {}, _obj[expression] = value, _obj);

例：

var dynamic_key = "hello";
var value = "world";
var obj = (_obj = {}, _obj[dynamic_key] = value, _obj);

console.log(obj);
// Object {hello: "world"}

(最新の Chrome でテスト済み)

于 2016-02-28T16:40:08.157 に答える
3

古い質問で、当時の答えは正しかったのですが、時代は変わります。誰かが Google 検索で掘り下げた場合、新しい JavaScript バージョン (ES6) では、角括弧で囲まれている場合、式をオブジェクト リテラルのキーとして使用できます。 var obj={["a"+Math.PI]:42}

于 2016-06-10T19:52:22.450 に答える
2

オブジェクト リテラルの場合、Javascript/ECMAScript スクリプトは、キーが有効な IdentifierName、文字列リテラル、またはクレジット番号 RobG (16 進数でも) のいずれかであることを指定します。表現ではありませんrequired.applicationPath + "/configs"。

于 2011-06-28T01:22:22.417 に答える
0

問題は、スマートなものを参照していないため、「this」を使用することです*。applicationPath を含む静的リテラルを作成します。

必要な変数={
    "applicationPath":"someWhereOverTheRainboW"
};

次に使用します

required.directories={};
required.directories[required.applicationPath + "/configs"]="アプリケーション構成フォルダーが存在しません";
....

動的に埋める

編集; 私は最初のアイデアを急ぎましたが、うまくいきませんでした。上記は現在動作しています - 申し訳ありません！

* 'this' キーワードは非常にスマートです :)しかし、多くの場合、ウィンドウ オブジェクトまたは要素、イベントが発生したか、呼び出された 'アクティブ' オブジェクトを参照します。したがって、多くの混乱を引き起こします;）

于 2011-06-28T01:15:50.993 に答える