在JavaScript里嵌入大量字符串常量的实现方法

数量少还好，多的话就密密麻麻的一坨文字，讲究美观的文艺青年们，会用大量的字符连接符号甚至加上缩进，强制换成好几行。例如：


代码如下:

var html =
    '<div>' +
        '<p>Hello</p>' +
        '<p>World'</p>' +
    '</div>';

这还好，要是字符串里有不少双引号单引号，那就更麻烦了，各种转义字符看的眼花缭乱。

　　其实有个不怎么起眼的小技巧，就能解决这个问题。大家总认为字符串必须在"..."或'...'里面，这点没错。但还有一个地方的字符串也能当非代码语义保存下来，那就是一个function的toString，把整个函数的代码当字符串输出——其中的注释部分当然也是保留的！

　　所以我们写个空函数，里面就一个/**/注释，其中就是我们想要的常量内容。toString后加一个正则就可以提取我们想要的！

　　马上试试：

代码如下:

var RES_CODE = _TEXT(function(){/*
    #include <iostream>

int main()
    {
        std::cout << "Hello world" << std::endl;
        return 0;
    }
*/});

var RES_POEM = _TEXT(function(){/*
　　更吹落，星如雨。
　　宝马雕车香满路。
　　凤箫声动，玉壶光转，一夜鱼龙舞。
　　蛾儿雪柳黄金缕，
　　笑语盈盈暗香去。
　　众里寻他千百度，
　　蓦然回首，那人却在灯火阑珊处。
*/});

var RES_XML = _TEXT(function(){/*
    <projectDescription>
        <name>Hello</name>
        <comment></comment>
        <projects>
        </projects>
        <buildSpec>
            <buildCommand>
                <name>com.adobe.flexbuilder.project.flexbuilder</name>
                <arguments>
                </arguments>
            </buildCommand>
            <buildCommand>
                <name>com.adobe.flexbuilder.project.apollobuilder</name>
                <arguments>
                </arguments>
            </buildCommand>
        </buildSpec>
    </projectDescription>
*/});

function _TEXT(wrap) {
    return wrap.toString().match(/\/\*\s([\s\S]*)\s\*\//)[1];
}
alert(RES_CODE);
alert(RES_POEM);
alert(RES_XML);

OK！就是Chrome里把注释每行前面的Tab去掉了，如果仅仅是放代码的话问题也不大~ 当然有个前提是字符里不能出现*/

值得注意的是，压缩代码的时会过滤注释，需要手动排除一部分。

赞 (0)

相关推荐

  • IE6下出现JavaScript未结束的字符串常量错误的解决方法

    里面提到"DOM是UTF-8的篇码,如果JS库不是分离的独立JS文件,而是包含在DOM里的,这个问题是不会出现的.然而分离的JS文件并不是UTF-8编码,被加库到UTF-8编码的DOM里,中文就出现了乱码,并影响到引号符,使浏览器无法判断字符串结束.解决变法很简单,JS文件另存为UTF-8编码格式即可. " 所以我修改了JavaScript的引用, <script type="text/javascript" src="**.js" cha

  • 简单掌握JavaScript中const声明常量与变量的用法

    ES6引入的第三个声明类关键词与let类似:const. 看一下用法: const c1 = 1; const c2 = {}; const c3 = []; Object.getOwnPropertyDescriptor(window,"c1") //Object {value: 1, writable: false, enumerable: true, configurable: false} 上面的例子说,不能在对c2进行赋值,但是可以改变c2的内容,因为c2是个对象,看例子:

  • JavaScript中全局变量、函数内变量以及常量表达式的效率测试

    JavaScript中全局变量、函数内变量以及常量表达式的效率测试

    var r, s = "this is a very very looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong string", x = /^\s+|\s+$/g; document.writeln("字符串测试 "); (function(){ document.write("全局->全局:"); var t = new Date(); for(

  • 引入autocomplete组件时JS报未结束字符串常量错误

    就我的问题以及解决办法: 我在引入jQuery的autocomplete组件时,遇到js报未结束字符串常量错误. 原因分析:首先,右击页面查看编码是utf-8, 其次,查看js报错的函数,以及找到对应的函数. 发现原来jQuery.autocomplete.js中的感叹号为中文的即!将其修改为英文的!,出错问题解决.

  • JavaScript 未结束的字符串常量常见解决方法

    1.JAVASCRIPT引用时,使用的字符语言不一致. 比如:<script type="text/javascript" src="xxx.js" charset="UTF-8″>. xxx.js文件内部使用的是GB2312的格式,外面调用使用的是UTF-8,所以文件内部部分特殊字符因为格式不一致,出现乱码,造成此原因. 改为charset="GBK"就可以了 2.JAVASCRIPT输出HTML字符时,前后标记不匹配.

  • js 未结束的字符串常量错误解决方法

    1.JAVASCRIPT引用时,使用的字符语言不一致. 比如:<script type="text/javascript" src="xxx.js" charset="UTF-8″>.xxx.js文件内部使用的是GB2312的格式,外面调用使用的是UTF-8,所以文件内部部分特殊字符因为格式不一致,出现乱码,造成此原因. 2.JAVASCRIPT输出HTML字符时,前后标记不匹配. 这种比较常见,往往在输出字符串时,出现单引号(')或双引号(&

  • 详解JavaScript常量定义

    相信同学们在看见这个标题的时候就一脸懵逼了,什么?JS能常量定义?别逗我好吗?确切的说,JS当中确实没有常量(ES6中好像有了常量定义的关键字),但是深入一下我们可以发现JS很多不为人知的性质,好好利用这些性质,就会发现一个不一样的JS世界. 首先,在JS当中,对象的属性其实还含有自己的隐含性质,比如下面对象: var obj = {}; obj.a = 1; obj.b = 2; 在这里我们定义了一个对象 obj ,并且定义了这个对象的两个属性 a . b ,我们可以修改这两个属性的值,可以用

  • 在JavaScript里嵌入大量字符串常量的实现方法

    数量少还好,多的话就密密麻麻的一坨文字,讲究美观的文艺青年们,会用大量的字符连接符号甚至加上缩进,强制换成好几行.例如: 复制代码 代码如下: var html =    '<div>' +        '<p>Hello</p>' +        '<p>World'</p>' +    '</div>'; 这还好,要是字符串里有不少双引号单引号,那就更麻烦了,各种转义字符看的眼花缭乱. 其实有个不怎么起眼的小技巧,就能解决这个

  • Javascript里的两种使用正则的方法

    在Javascript里,有两种使用正则的方法,一是创建一个正则表达式的实例,而是使用String对象里的正则表达相关的方法. 正则表达式对象 两种创建方法 var my_regex=/[a-z]+/g;  var my_regex=new ("[a-z]+","g"); 方法 exec(string),对string进行正则处理,并返回匹配结果.  test(string),测试string是否含有匹配结果 字符串对象中的正则 方法 match(pattern) 

  • JavaScript通过字典进行字符串翻译转换的方法

    本文实例讲述了JavaScript通过字典进行字符串翻译转换的方法.分享给大家供大家参考.具体分析如下: 这里实际上就是先设置一个对照的字典,然后通过翻译函数,从字典中找到相应的键值.需要在JavaScript 1.8以上版本使用 函数定义如下: function CreateTranslator(translationTable) function(s) s.replace( new RegExp([k for (k in translationTable)].join('|'), 'g'),

  • JavaScript 删除或抽取字符串指定字符的方法(极为常用)

    目录 1.substring() 2.substr() 3.indexOf() 4.lastIndexOf() 5.replace() 1.substring() 方法用于提取(字符串)两个指定下标之间的字符. let a = "1,2,3"; document.write(a.substring(2,a.Length)) //第一个参数从下标为0的字符开始,包括当前下标0, //第二个参数到下标为几的字符结束,不包含当前下标,默认比要提取的子串的最后一个字符在字符串中的下标位置长度多

  • Javascript中将变量转换为字符串的三种方法

    前言 大家应该都知道,对于JavaScript,有3种不同方法可以将变量转换为字符串.这篇文章将详细介绍这些方法,并比较他们的优劣.下面话不多说了,来一起看看详细的介绍吧. 3种方法 将变量转换为字符串的3种方法如下: value.toString() "" + value String(value) 当value为null或者undefined时,第1种方法就不行了.而方法2和方法3基本上是一样的. ""+value: 将value与空字符串相加,即可将其转换为字

  • 在Javascript里访问SharePoint列表数据的实现方法

    在SharePoint2010里有了很好的解决方案(详见拙文SharePoint客户端编程系列http://www.jb51.net/article/27198.htm),但是在SharePoint2007里就没那么好用,具体问题具体分析,本文要解决的是如何在JavaScript里通过WebService访问SharePoint数据的问题. 首先需要从此处(http://darrenjohnstone.net/download/12)下载JavaScript API包 引用次JS,里面有两个库,

  • JavaScript中将值转换为字符串的五种方法总结

    前言 如果您关注Airbnb的样式指南,首选方法是使用"String()"

随机推荐