Javascript JSLint 混合空格和制表符错误
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3457306/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JSLint mixed spaces and tabs error
提问by RyanP13
I have run the following through JSLint:
我已经通过 JSLint 运行了以下内容：
$(document).ready(function() {
/*
Add paragraph on page load
*/
// Get all header elements
var header = document.getElementsByTagName('h1'),
parent,
newP,
text;
// Loop through the elements
for (var i=0, m = header.length; i < m; i++) {
parent = header[i].parentNode;
newP = document.createElement("p");
text = document.createTextNode('This paragraph was inserted with JavaScript!');
newP.appendChild(text);
// Insert the new P element after the header element in its parent node
parent.insertBefore(newP, header[i].nextSibling);
}
// so much easier with jQuery!
//$('.section > h1').after('<p>I am a new paragraph & I have been added to the page with javascript!</p>');
/*
Toggle show/hide
*/
// display show/hide link - hidden by default if JS disabled as functionality is not available
$('#content > .section > h2 > a').removeClass('hide');
// hide What's new on page load - all content will be available if JS disabled
$('#content > .section > ul').addClass('hide');
// show/hide content on click event
$('#content > .section > h2 > a').live('click',function() {
$('#content > .section > ul').toggle();
return false;
});
/*
JSON
*/
var $jsonURL = 'scripts/response.json';
$.ajax({
type: 'GET',
url: $jsonURL,
dataType: "json",
success: function(data){
$.each(data.data, function(i, data){
var $html = '';
var $string = '';
if (data.type == 'comment') {
$string = 'file';
} else {
$string = 'workspace';
}
$html += '<li class="' + data.type + '">';
$html += '<strong>New ' + data.type + '</strong> was added to the ' + $string + ' ';
$html += '<a href="' + data.target + '">' + data.target + '</a> ';
$html += '<a href="' + data.workspace + '">' + data.workspace + '</a>';
$html += ' by <a href="#">' + data.user + '</a>';
$html += '</li>';
$('#content > .section > ul').append($html);
});
},
error:function (xhr, ajaxOptions, thrownError){
alert(xhr.status);
alert(thrownError);
}
});
});
And am getting this error:
并且我收到此错误：
Error:
Problem at line 89 character 4: Mixed spaces and tabs.
}
Implied global: $ 1,31,34,37,39,51,57,81, document 1,8,16,17, alert 87,88
Not really sure how to fix?
不确定如何修复？
回答by Andy E
This error occurs when your indentation uses a combination of both spaces and tabs, for example, {SPACE}{SPACE}{TAB}{SPACE}or {TAB}{SPACE}{TAB}. I'm not really sure why it's an error and not a warning, but the solution is to revisit the line and make sure you only use spaces OR tabs.
当您的缩进同时使用空格和制表符（例如，{SPACE}{SPACE}{TAB}{SPACE}或 ）时，会发生此错误{TAB}{SPACE}{TAB}。我不确定为什么它是错误而不是警告，但解决方案是重新访问该行并确保您只使用空格或制表符。
The problem with mixing tabs and spaces is you could run into indentation issues when the file is viewed in a different application. For instance, one user may have tabs configured to equal two spaces, another could open the first user's file and see uneven indentation because two spaces plus one tab equals 6 spaces as opposed to 4 in the first's app. Using one or the other ensures better readability of your code.
混合制表符和空格的问题是在不同的应用程序中查看文件时可能会遇到缩进问题。例如，一个用户可能将制表符配置为等于两个空格，另一个用户可以打开第一个用户的文件并看到不均匀的缩进，因为两个空格加一个制表符等于 6 个空格，而不是第一个应用程序中的 4 个。使用其中之一可确保您的代码具有更好的可读性。
Interestingly enough, Stack Overflow normalizes tabs into 4 spaces, so copying and pasting your code from here back into JSLint fixes the problem.
有趣的是，Stack Overflow 将制表符规范化为 4 个空格，因此将您的代码从这里复制并粘贴回 JSLint 可以解决此问题。
回答by Dave Dopson
You might also consider using the "smarttabs" option available in JSHint (JSHint is a drop-in replacement for JSLint, just better).
您也可以考虑使用 JSHint 中提供的“smarttabs”选项（JSHint 是 JSLint 的直接替代品，更好）。
This article is really insightful, objectively explains the tradeoffs involved in tabs v spaces (I didn't realize there was even that much one could say on the subject), and demonstrates how smart tab logic should behave:
这篇文章非常有见地，客观地解释了制表符与空格所涉及的权衡（我没有意识到关于这个主题甚至可以说这么多），并演示了智能制表符逻辑应该如何表现：
http://www.emacswiki.org/emacs/SmartTabs
http://www.emacswiki.org/emacs/SmartTabs
Basically, if you use tabs for 'indentation' you are allowed to use spaces for 'alignment' as long as any spaces are "used for alignment only", ie that they are preceeded by the correct number of indentation tabs:
基本上，如果您将制表符用于“缩进”，则允许使用空格进行“对齐”，只要任何空格“仅用于对齐”，即它们前面有正确数量的缩进制表符：
Which makes this code snippet legal ("---->" represents a TAB):
这使得这个代码片段合法（“---->”代表一个制表符）：
function foo() {
---->var a = 4,
----> b = 5,
----> c = 6;
}
You can do this with a file called '.jshintrc':
您可以使用名为“.jshintrc”的文件执行此操作：
{
"smarttabs": true
}
Or you can set it in the source code with a comment:
或者您可以在源代码中添加注释来设置它：
/*jslint smarttabs:true */
Or you could just ditch tabs entirely ... (religious war ensues).
或者你可以完全放弃标签......（宗教War随之而来）。
Personally, I use JSHint which is a derivative project of JSLint with arguably more configurability and such. For most purposes, they are the same tool. http://jshint.com/docs/#options. I'd reccomend it. Most options are common between the two tools.
就我个人而言，我使用 JSHint，它是 JSLint 的衍生项目，可以说具有更多的可配置性等。对于大多数用途，它们是相同的工具。 http://jshint.com/docs/#options。我会推荐它。大多数选项在这两种工具之间是通用的。
I also don't use tabs. Ever. Given the choice, I'm a two-spaces guy.
我也不使用标签。曾经。如果可以选择，我是一个有两个空间的人。
