以前一直搞不懂javscript裡的Array-like和Array到底差在哪裡，今天終於有機會讓我初步了解他們的差異了。寫個……
事情發生在我要對陣列使用map function的時候
[code language=”javascript”]
onDrop={function(data){
console.log(data);
var dataToItem=function(data,index){
console.log(data);
console.log(index);
return data.props.text;
}
self.props.updateItems(data.map(dataToItem));
}}
[/code]
console結果：
[Object, Object, Object]
Object {$$typeof: Symbol(react.element), key: "1s", ref: null, props: Object, _owner: c}
0
Object {$$typeof: Symbol(react.element), key: "2d", ref: null, props: Object, _owner: c}
1
Object {$$typeof: Symbol(react.element), key: "3d", ref: null, props: Object, _owner: c}
2
接著，當我如法炮製，想要對以jquery .find回傳的物件做相同的時時，就發生錯誤了
[code language=”javascript”]
var data=$(this.getDOMNode()).find(‘.draggable-handle’);
var data2data2=function(data,index){
console.log(data);
console.log(index);
return $(data).html();
}
var data2=data.map(data2data2);
console.log(data2);
[/code]
問題發生在$(data).html()這行，看一下console
[div.draggable-element, context: div.draggable-element] 0 [div class="draggable-handle" data-reactid=".0.1.0:$reaorderable-node-1.$0asdasd.0"]asdasd[/div] 1 [div class="draggable-handle" data-reactid=".0.1.0:$reaorderable-node-2.$1a.0"]a[/div] Uncaught TypeError: Cannot read property 'createDocumentFragment' of undefined
ps: wordpress無法正常顯示<div>，以[div][/div]代替
可以發現兩者的data和index是反過來的，查了一下，才發現原因是find()回傳的是jquery類陣列(Array-like)，所以有這樣的結果。要解決這樣的問題，只要
[code language=”javascript”]
var data2=data.toArray().map(data2data2);
[/code]
就可以了
關於我：
我是沒一村，專長和興趣是程式、主動投資、科技商業模式。可以參考我的書單和比較熱門的文章：