Immutable.js：表示2D遊戲領域的數據結構

我在想我應該用什麼數據結構來表示一個方形遊戲板（考慮每個單元格可以有一些顏色）。最自然的想法是二維列表，但很難查詢和改變它。Immutable.js：表示2D遊戲領域的數據結構

所以，現在使用地圖，鍵${x}.${y}（存在JS :(無元組）和值代表顏色像這樣的東西蜇傷：

Map([['0.0', 'red'], ['0.1', 'red'], ['1.0', 'blue'], ['1.1', 'red']])

它是確定使用這些數據？結構是否有Immutable.js方面的任何更好的解決方案

來源

2016-04-13 kharandziuk

我正在構建一些自己的2D遊戲板，並且遇到了同樣的問題。我所做的解決方案是Record。

它看起來像一個物體，也表現得像一個物體。但是用香草物體，你不能做下面的映射字典的東西。

const dict = {}; 

const key1 = { row: 0, col: 1 }; 
const value1 = { some: 'value' }; 

dict[key1] = value; // will not work

這是我想要的，儘管我試圖使映射儘可能簡單。與Record和Map從Immutable.js，您可以執行以下操作。

import { Map, Record } from 'immutable'; 

const dict = Map(); 
const Pos = Record({ row: 0, col: 0 }); // some initial value. 
const Val = Record({ some: 'value' }); // same here. 

const key1 = new Pos({ row: 0, col: 1 }); 
const value1 = new Val({ some: 'value' }); 

dict = dict.set(key1, value1); // works like you wish

您可以閱讀官方文檔瞭解更多信息。也許你有更好的解決方案，請讓我知道:)。

來源

2016-04-13 16:54:02

好的答案！我可以比較兩個記錄嗎？ – kharandziuk

當然你可以，結帳Immutable.is（） –

我想這是有道理的添加到答案 – kharandziuk

是否有一個理由，爲什麼你不能用一個2維數組，像這樣：

let square = [ 
    ['red', 'green', 'blue'], 
    ['orange', 'red', 'blue'], 
    ['red', 'blue', 'blue'] 
];

然後，您可以將上述數據結構添加到您的地圖。

所以要訪問中間的磁貼，您可以使用數組的索引[1][1]。

來源

2016-04-13 16:12:36 Neal

>在Immutable.js方面有沒有更好的解決方案？ – kharandziuk

你可以在這裏找到的原因https://facebook.github.io/react/docs/advanced-performance.html – kharandziuk

我確定有。你只是要求數據結構。我就是這麼做的。問題在於，如果你說這是一個「遊戲板」，爲什麼你會希望它是不可變的？它會不會在某個點或另一個點改變狀態？ – Neal

我很好奇你爲什麼認爲列表清單很難查詢和更改。您可以使用長度爲2的數組作爲[x, y]對，並將其傳遞給getIn，setIn和updateIn方法。

let grid = Immutable.toJS([ 
    ['red', 'green'], 
    ['blue', 'yellow'] 
]); 

grid.getIn([0, 1]); // => 'green'; 
grid = grid.setIn([0, 1], 'purple'); 
grid.getIn([0, 1]); // => 'purple'; 
grid = grid.updateIn([0, 0], cell => cell.toUpperCase()); 
grid.getIn([0, 0]); // => 'RED';

很容易一些功能應用到網格中的每一個細胞都帶有map(...)：

可能是比用地圖正試圖找到一個價值座標棘手

grid.map((row, x) => row.map(cell, y) => x + cell + y); 
grid.get([1, 1]); // => '1yellow1'

一件事。

const x = grid.findIndex(row => row.contains('blue')); // => 1 
const y = grid.get(x).indexOf('blue'); // => 0 
grid.get([x, y]); // => blue

來源

2017-11-13 20:44:01

Immutable.js：表示2D遊戲領域的數據結構

回答

相關問題