2017-03-23 9 views
1

次のコードはMike BostockのForce-Directed Graph with Mouseoverのコードです。私はこのコードについてより鋭い質問をすることはできませんが、申し訳ありませんが、誰かがリンクから別個のノードを計算するforEachブロックの構文を説明できるかどうか疑問に思っていました。JavaScriptでの複数の代入式と構文の説明

以下の行ではどういうことが起こり、どの変数に割り当てられていますか?同じ式で複数の代入を実行するための名前はありますか?

link.source = nodes[link.source] || (nodes[link.source] = {name: link.source});

var links = [ 
    {source: "Ericsson", target: "ZTE", type: "suit"}, 
    {source: "Kodak", target: "Samsung", type: "resolved"}, 
    {source: "Apple", target: "Samsung", type: "suit"}, 
    {source: "Kodak", target: "RIM", type: "suit"}, 
    {source: "Nokia", target: "Qualcomm", type: "suit"} 
]; 

var nodes = {}; 

// Compute the distinct nodes from the links. 
links.forEach(function(link) { 
    link.source = nodes[link.source] || (nodes[link.source] = {name: link.source}); 
    link.target = nodes[link.target] || (nodes[link.target] = {name: link.target}); 
}); 

答えて

2

このラインで解凍するかなりの量が実際にあります:

link.source = nodes[link.source] || (nodes[link.source] = {name: link.source});

まず、x = y || zはこれに*と等価であることに言及しなければならない:

if (y) 
    x = y; 
else 
    x = z; 

It i = (j = k)は、kjに割り当て、その値をiに割り当てることを意味することにも注意してください。したがって、最後には、i,j、およびkはすべて同じ値を持ちます。

したがって、この場合には、私たちは本当にこの取得している:nodes[link.source]が(0ではない、ヌル、未定義、空の文字列)truthyであれば、その後、link.sourceはnodes[link.source]が割り当てられますされ

if (nodes[link.source]) { 
    link.source = nodes[link.source]; 
} else { 
    nodes[link.source] = { name: link.source }; 
    link.source = nodes[link.source]; 
} 

を値として。

偽である場合、link.sourcenodes[link.source]の両方に値が割り当てられます。{name: link.source}あなたはすでに真のステートメントを評価することができます - あなたは||を評価しているときに、左手側はtruthyであれば、右辺を評価する必要がないため


*これらは同等です。だからJavaScriptでは、yが真実ならばyを返し、yが偽であればzだが、zは真実であるか、どちらも偽であればfalseである。