什么是JSLint批准的创建长字符串的方法？

Question

_{作为前言,是的,我知道JSLint更多的是一套指导而不是规则.}

在使用JSLint清理我继承的一些代码时,有很多地方会在字符串中使用某些URL.它们对于脚本来说是必需的,但是比标准的50个字符行长更长.

我一直只是路过那些特定的路线,因为它们不是问题; 但是,它让我对在JS代码中处理长字符串文字的最佳方法感到好奇.

对于标记字符串,使用字符串连接是有意义的:

'<div>' +
  '<h1>Foo</h1>' +
  '<p>Lorem ipsum</p>' +
'</div>'

但是我不认为它对URL有意义:

'http://example.com/foo/bar/baz/fizz/buzz/lorem/ipsum/etc/...'

编辑

对于某些哈希值(例如用于API密钥),它也没有意义:

//i.e. this made up string of me bashing on my keyboard
'0aidf9ejvr0e9vjkilkj34ioijs90eu8f9948joljse890f90jiljoi4'

Answer 1

你可以用类似的东西

[
    "http://example.com",
    "foo",
    "bar",
    "baz",
    ...
    "lastSegment"
].join("/");

但这看起来不太可读.通常,某些编码指南明确地删除了URL的字符串长度限制(与Java的import语句相同- 可以是任意长的.)

Answer 2

我认为你的问题不能只有一个正确的答案.有许多方法可以在JavaScript中编写长字符串,这主要取决于您选择的品味.我可以在这里描述一下我对这个问题的看法.

首先,您可以使用maxlenJSlint选项将默认行长度更改为您喜欢的任何值.例如

/*jslint maxlen: 130 */

但我想你已经了解了这个设定.

我想您可以使用JavaScript代码的一些Minifiers来有效地使用JavaScripts(如Closure Compiler,Microsoft Ajax Minifier或其他).如何在页面上轻松验证代码

// ==ClosureCompiler==
// @compilation_level SIMPLE_OPTIMIZATIONS
// @output_file_name default.js
// ==/ClosureCompiler==

// ADD YOUR CODE HERE
function hello(name) {
    var test = '<div>' +
                   '<h1>Foo</h1>' +
                   '<p>Lorem ipsum</p>' +
               '</div>';
    return test + name;
}
hello('New user');

将被缩小到

function hello(a){return"<div><h1>Foo</h1><p>Lorem ipsum</p></div>"+a}hello("New user");

并且所有字符串常量将被连接.因此,您可以使用长字符串常量格式化代码,这样可以更好地读取代码.缩小器将为您完成剩余的工作.

在长URL的情况下,您可以在逻辑上看起来最好的任何地方打破长字符串(我认为它总是在某些'/'字符上).在大多数实际情况中,您会有一些baseURL附加的内容.因此,您可以在文件开头或单独的JavaScript文件中的某处定义公共项目设置

var baseLoremUrl = 'http://example.com/foo/bar/baz/fizz/buzz/lorem/';

并在以后使用它

'<a href="' + baseLoremUrl + 'ipsum/etc/' + '">Click me!</a>'

如果你有参数应该附加到URL之类的

'http://example.com/foo/bar/baz/fizz/buzz/lorem?x=123&y=ABC'

我一直用

baseLoremUrl + '?' + $.params({x: 123, y: 'ABC'})

从一方开始使代码更具可读性,并确保在需要时对encodeURIComponent正确编码所有参数.

以上都是我在编写JavaScript代码时尝试遵循的规则.