2008-10-15 53 views
16

從Mozilla的JavaScript 1.7 changlog中可以看出,他們添加了解構賦值工具。可悲的是,我不是很喜歡的語法(爲什麼寫a和b兩次?):JavaScript中的解構賦值工作

var a, b; 
[a, b] = f(); 

像這樣的事情會好了很多:

var [a, b] = f(); 

這仍然是向後兼容。類似Python的解構不會向後兼容。

反正我已經能夠拿出對JavaScript 1.5的最佳解決方案是:

function assign(array, map) { 
    var o = Object(); 
    var i = 0; 
    $.each(map, function(e, _) { 
     o[e] = array[i++]; 
    }); 
    return o; 
} 

其工作方式:

var array = [1,2]; 
var _ = assign[array, { var1: null, var2: null }); 
_.var1; // prints 1 
_.var2; // prints 2 

但是,這真的很爛,因爲_是沒有意義的。這只是一個空殼來存儲名稱。但令人遺憾的是,它是必需的,因爲JavaScript沒有指針。在正面,您可以在值不匹配的情況下分配默認值。另請注意,此解決方案不會嘗試對數組進行分片。所以你不能做像{first: 0, rest: 0}這樣的東西。但是,如果有人想要這種行爲,那很容易做到。

什麼是更好的解決方案?

回答

23

首先,var [a, b] = f()作品只是在JavaScript 1.7精 - 試試吧!

其次,你可以使用with()順利進行,使用語法略有

var array = [1,2]; 
with (assign(array, { var1: null, var2: null })) 
{ 
    var1; // == 1 
    var2; // == 2 
} 

當然,這不會讓你修改現有變量的值,所以恕我直言,這是少了一大堆比JavaScript 1.7功能更有用。在代碼中,我正在寫現在,我只是直接返回對象並引用它們的成員 - 我將等待1.7功能變得更加廣泛可用。

4

你不需要虛擬「_」變量。

window["foo"] = "bar"; 
alert(foo); // Gives "bar" 

這裏有幾個要點::您可以通過使用window對象範圍直接創建「全局」變量

  • 我不會命名這個功能 「分配」,因爲這是太普通 一個條件。
  • 要更接近類似於JS 1.7語法,我會讓函數將目標作爲第一個參數 和源作爲 第二個參數。
  • 使用對象字面值來傳遞目標變量很酷,但可以與JS 1.7解構相混淆,其中目標實際上是對象而不是數組。我更喜歡用逗號分隔的變量名列表作爲字符串。

這就是我想出了:

function destructure(dest, src) { 
    dest = dest.split(","); 

    for (var i = 0; i < src.length; i++) { 
     window[dest[i]] = src[i]; 
    } 
} 

var arr = [42, 66]; 

destructure("var1,var2", arr); 

alert(var1); // Gives 42 
alert(var2); // Gives 66 
+2

我同意的唯一的事情是,解構可能是一個更好的名字。 *來源,目的地是unix風格。 *填充全球範圍是不好的。它不會導致組合性。 *將輸出變量寫入字符串會讓您的編輯人員感到疲倦和困難。就像編寫SQL一樣。 – 2008-10-15 18:31:49

+0

@AndersRuneJensen由於這模仿了一個賦值,因此目標應該幾乎肯定在左邊 - 就像`[var1,var2] = arr`。而`destructure`是一個可怕的,無意露出的名字。我認爲`assign`更好 - 畢竟,這被認爲是一個通用的效用函數。如果不是,那麼也許`massAssign`? – 2014-06-27 19:36:12

0

在標準的JavaScript我們習慣了各種醜陋的,並模仿使用一箇中間變量解構賦值是不是太糟糕:

function divMod1(a, b) { 
    return [ Math.floor(a/b), a % b ]; 
} 

var _ = divMod1(11, 3); 
var div = _[0]; 
var mod = _[1]; 
alert("(1) div=" + div + ", mod=" + mod); 

但是我認爲以下的模式是更idomatic:

function divMod2(a, b, callback) { 
    callback(Math.floor(a/b), a % b); 
} 

divMod2(11, 3, function(div, mod) { 
    alert("(2) div=" + div + ", mod=" + mod); 
}); 

請注意,不是將兩個結果作爲數組返回,而是將它們作爲參數傳遞給回調函數。

(見http://jsfiddle.net/vVQE3/運行的代碼)

1

這是我在PHPstorm 10那樣:

文件 - >設置 - >語言&框架 - > ...

...將JavaScript語言版本設置爲例如JavaScript 1.8.5 ...

- >單擊應用。