![](/img/trans.png)
[英]"Uncaught TypeError: Cannot read property 'length' of undefined" for an array iteration
[英]Uncaught TypeError: Cannot read property 'length' of undefined (array)
以下是我为Phonegap项目工作的一段代码。
JSFiddle: http : //jsfiddle.net/wC79k/
我正在尝试绘制具有提供的角度的曲线(sensorAngles数组)。 该阵列将通过蓝牙更新(首先以字符串形式发送),因此,如果接收的数据没有损坏(也就是每个阵列中没有空或虚假元素,全长),我将只需要更新曲线。
我现在通过setTimeout更新角度数组来“模拟”蓝牙串行更新。
当前,脚本按预期工作(当损坏的数组/字符串时曲线不会绘制/更新,并且在收到未损坏的数组后会继续更新),但是我遇到了以上错误(Uncaught TypeError)。
这似乎与第26行有关,其中损坏的数组使sensorAngles不确定(因此.length不起作用)。
for (var i = 0; i < (sensorAngles.length); i++){
sensorPos.push({
x: sensorPos[i].x - diffPos(sensorAngles[i]).dx,
y: sensorPos[i].y - diffPos(sensorAngles[i]).dy
});
}
我尝试向其中添加if语句,但是曲线将不再更新。
我两天前才刚开始使用Javascript和Phonegap,所以任何帮助都将是很大的!
欢呼,京东
完整代码:
var stage = new Kinetic.Stage({
container: 'myCanvas',
width: window.innerWidth,
height: window.innerHeight
});
var sensorLayer = new Kinetic.Layer();
/* initialise an empty array of all the angles */
var sensorAngles = [0, 0, 0, 0, 0, 0, 0, 0];
//var sensorPos = [];
/* divide each sensor distance segment by height of screen/window for
maximum amount of canvas being used */
var sensorDistance = (stage.getHeight() / ((sensorAngles.length) + 2));
function diffPos(angle){ // angles in radians
return {
dx: sensorDistance * Math.sin(angle),
dy: sensorDistance * Math.cos(angle)
}
};
function calcSpline(sensorAngles){
sensorPos = [{x: (stage.getWidth() / 2), y: (stage.getHeight() - sensorDistance)}];
for (var i = 0; i < (sensorAngles.length); i++){
sensorPos.push({
x: sensorPos[i].x - diffPos(sensorAngles[i]).dx,
y: sensorPos[i].y - diffPos(sensorAngles[i]).dy
});
}
return sensorPos;
};
calcSpline(sensorAngles);
var sensorPos = calcSpline(sensorAngles);
var spine = new Kinetic.Spline({
points: sensorPos,
stroke: 'red',
strokeWidth: 2,
lineCap: 'round',
tension: 0.3
});
sensorLayer.add(spine);
stage.add(sensorLayer);
function updateSpline(angles){
calcSpline(sanityCheck(angles));
spine.setPoints(sensorPos);
sensorLayer.draw();
};
function sanityCheck(data) {
data = data.split(",");
if (data.filter(function(n){return n}).length === sensorAngles.length) {
sensorAngles = data;
return sensorAngles;
}
}
setTimeout(
function() {
updateSpline("0.1,0.12,0.08,-0.2,0.1,0.85,0.1,-0.2")
},1000
);
setTimeout(
function() {
updateSpline("0.1,0.2,0.1,-0.1,0.1,0.1,0.1,-0.2")
},2000
);
setTimeout(
function() {
updateSpline("0.1,0.12,0.08,-0.2,0.1,0.85,0.1,-0.2")
},3000
);
setTimeout(
function() {
updateSpline("0.4,0.5,,-0.6,0.2,0.96,0.02,-0.01") //corrupt
},4000
);
setTimeout(
function() {
updateSpline("0.1,,0.08,-0.2,0.1,0.85,0.1,-0.2") // corrupt
},5000
);
setTimeout(
function() {
updateSpline("0.6,0.12,0.22,-0.2,0.1,0.85,0.1,-0.2")
},6000
);
如果长度不够,可以尝试console.log()并检查是否在console中获得了写值?
例
console.log()
for (var i = 0; i < (sensorAngles.length); i++){
sensorPos.push({
x: sensorPos[i].x - diffPos(sensorAngles[i]).dx,
y: sensorPos[i].y - diffPos(sensorAngles[i]).dy
});
}
您可以使用try ... catch块来忽略损坏的数组。
try {
for (var i = 0; i < (sensorAngles.length); i++){
sensorPos.push({
x: sensorPos[i].x - diffPos(sensorAngles[i]).dx,
y: sensorPos[i].y - diffPos(sensorAngles[i]).dy
});
}
}catch(err){
// console.log("oops");
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.