我会有一个问题。 以下脚本没有错误地通过JSLint。 请不要投票给我。此脚本仅用于学习目的,以便更好地理解闭包。如果您比它更了解它,请发布您的解决方案。
问题是当我用JSLint检查代码时,我收到以下错误消息:
JSLint无法完成。 43.8预期';'而是看到'}'
这是我的剧本
var c = document.querySelector("#c");
var ctx = c.getContext("2d");
var path = function () {
return {
innerTri: function (x, y, width, height, fill, stroke) {
x = x || 0;
y = y || 0;
fill = fill || "yellow";
stroke = stroke !== undefined ? stroke : fill;
if (width === undefined || height === undefined) {
alert("You need to provide width and height");
return false;
}
ctx.beginPath();
ctx.moveTo(x, y);
ctx.lineTo(x = x + width, y);
ctx.lineTo(x, y = y + height);
ctx.closePath();
ctx.fillStyle = fill;
ctx.strokeStyle = stroke;
ctx.fill();
ctx.stroke();
},
outRect: function (x, y, width, height, stroke) {
x = x || 0;
y = y || 0;
stroke = stroke || "black";
if (width === undefined || height === undefined) {
alert("You need to provide width and height");
return false;
}
ctx.beginPath();
ctx.moveTo(x, y);
ctx.lineTo(x = x + width, y);
ctx.lineTo(x, y = y + height);
ctx.lineTo(x = x - width, y);
ctx.strokeStyle = stroke;
ctx.closePath();
ctx.stroke();
}
}
} //this is the position 43.8
var a = path();
a.innerTri(225, 225, 50, 50, "yellow", "green");
a.outRect(200, 200, 100, 100, "blue");
如果我在那里放一个分号,那么每条线都会收到错误信息。 该脚本按预期工作,但我对此错误无能为力。
谢谢
答案 0 :(得分:1)
你试过把#34 ;;"在相关线上方的第(42)行的末尾?尝试将它放在两条线上并再次运行。
更新: 添加"使用严格&#34 ;;在脚本的开头。告诉JsLint容忍"空白混乱"。添加";"在第42和43行。运行JsLint,现在您将看到真正的错误:
Unexpected statement '=' in expression position.
ctx.lineTo(x = x + width, y);
Unexpected statement '=' in expression position.
ctx.lineTo(x, y = y + height);
Unexpected statement '=' in expression position.
ctx.lineTo(x = x + width, y);
Unexpected statement '=' in expression position.
ctx.lineTo(x, y = y + height);
Unexpected statement '=' in expression position.
ctx.lineTo(x = x - width, y);
答案 1 :(得分:1)
好的,所以你正在使用非常严格的linting规则。
以下列出了我需要改变的内容,以使得品牌变得快乐:
"use strict";
函数path
语句
lineTo()
参数列表window
作为全局对象(在JSLint设置中)window.alert()
而非alert()
以下是生成的代码的样子:
var c = document.querySelector("#c");
var ctx = c.getContext("2d");
var path = function () {
"use strict";
return {
innerTri: function (x, y, width, height, fill, stroke) {
x = x || 0;
y = y || 0;
fill = fill || "yellow";
if (stroke === undefined) {
stroke = fill;
}
if (width === undefined || height === undefined) {
window.alert("You need to provide width and height");
return false;
}
ctx.beginPath();
ctx.moveTo(x, y);
x = x + width;
ctx.lineTo(x, y);
y = y + height;
ctx.lineTo(x, y);
ctx.closePath();
ctx.fillStyle = fill;
ctx.strokeStyle = stroke;
ctx.fill();
ctx.stroke();
},
outRect: function (x, y, width, height, stroke) {
x = x || 0;
y = y || 0;
stroke = stroke || "black";
if (width === undefined || height === undefined) {
window.alert("You need to provide width and height");
return false;
}
ctx.beginPath();
ctx.moveTo(x, y);
x = x + width;
ctx.lineTo(x, y);
y = y + height;
ctx.lineTo(x, y);
x = x - width;
ctx.lineTo(x, y);
ctx.strokeStyle = stroke;
ctx.closePath();
ctx.stroke();
}
};
};
var a = path();
a.innerTri(225, 225, 50, 50, "yellow", "green");
a.outRect(200, 200, 100, 100, "blue");