精华内容
下载资源
问答
  • 前端js入门——JavaScript 字符串拼接

    千次阅读 2019-06-06 21:59:46
    本文将通过代码实例详细介绍一下JavaScript如何实现字符串拼接操作。 .使用加号(+)拼接: 加号不但可以实现算数运算,也可以实现字符串拼接操作。 代码实例如下: console.log(``"兴趣部落"``+``"海岛市南区"``)...

    实际应用中,目标字符串的生成可能需要多个数据的拼接。

    由于应用频繁,几乎是所有编程语言都必须掌握的操作,当然每种语言具有各自特点。

    本文将通过代码实例详细介绍一下JavaScript如何实现字符串拼接操作。

    一.使用加号(+)拼接:

    加号不但可以实现算数运算,也可以实现字符串拼接操作。

    代码实例如下:

    console.log(``"兴趣部落"``+``"海岛市南区"``);

    上述代码使用加号(+)实现两个字符串的拼接操作。

    目的是演示加号拼接功能,实际项目中根本没可能这么用。

    let webName=``"兴趣部落"``;

    let address=``"海岛市南区"``;

    let str=webName + "位于" + address;

    console.log(str);

    代码实现了字符串拼接效果,webName与address是变量,不能将它们直接包裹于引号之中。

    否则,webName与address就不是变量了,变量名称直接就成为字符串的一部分。

    代码实例如下:

    let webName=``"兴趣部落"``;

    let address=``"海岛市南区"``;

    let str=``"webName位于address"``;

    console.log(str);

    二.字符串与非字符串数据拼接:

    前面代码都是字符串之间的拼接操作,其实字符串数据也可以与非字符串数据进行拼接。

    首先看一段代码实例:

    console.log(5+``"5"``);

    可数字5与字符串"5"进行拼接,首先会将数字转换为字符串,然后再进行拼接操作。

    当然字符串不止可以和数字进行拼接,也可以与其他数据类型进行拼接操作,本文不再演示。

    内在原理是,不同数据类型进行拼接操作的时候,首先会进行隐式数据类型转换。

    考虑到篇幅问题,本文不做介绍。

    三.模板字符串实现拼接:

    ES2015之前只能通过加号实现字符串拼接,如果数据量较大,那么代码看起来比较繁琐。

    现在新增了更为简单的字符串拼接方式,使用模板字符串与占位符可以实现更为简洁直观的拼接操作。

    代码实例如下:

    let webName=``"兴趣部落"``;

    let address=``"海岛市南区"``;

    let str = w e b N a m e 位 于 {webName}位于 webName{address};

    console.log(str);

    上面利用模板字符串与占位符实现了非常简洁直观的拼接操作。

    省去了加号运算符,这也是简洁直观的关键因素。

    四.字符串一旦创建不可更改:

    字符串一旦创建,其值不可更改,看如下代码实例:

    let str=``"兴趣部落"``;

    let str=str+``"海岛市南区"``;

    console.log(str);

    最后打印结果是"兴趣部落海岛市南区",这时候肯定会有朋友问,字符串的值不是已经改变了吗。其实不然,改变的是str变量值,上述操作首先销毁原来字符串"兴趣部落",然后再将拼接后的新字符串"兴趣部落市南区"赋值给变量str,并不是直修改原字符串。

    最后,给大家推荐一个前端学习进阶内推交流群685910553前端资料分享),不管你在地球哪个方位,
    不管你参加工作几年都欢迎你的入驻!(群内会定期免费提供一些群主收藏的免费学习书籍资料以及整理好的面试题和答案文档!)

    如果您对这个文章有任何异议,那么请在文章评论处写上你的评论。

    如果您觉得这个文章有意思,那么请分享并转发,或者也可以关注一下表示您对我们文章的认可与鼓励。

    愿大家都能在编程这条路,越走越远。

    展开全文
  • 本文介绍的是Javascript中的字符串拼接,希望对你有帮助,一起来看。   最近在研究《javascript高级程序设计》中,有段关于字符串特点的描述,原文大概如下:ECMAScript中的字符串是不可变的,也就是说,字符串...

    字符串拼接是所有程序设计语言都需要的操作。当拼接结果较长时,如何保证效率就成为一个很重要的问题。本文介绍的是Javascript中的字符串拼接,希望对你有帮助,一起来看。

     

    最近在研究《javascript高级程序设计》中,有一段关于字符串特点的描述,原文大概如下:ECMAScript中的字符串是不可变的,也就是说,字符串一旦创建,他们的值就不能改变。要改变某个变量的保存的的字符串,首先要销毁原来的字符串,然后再用另外一个包含新值的字符串填充该变量,例如:

     

     

    var lang = "Java";
    lang = lang + "Script";

     

     

     实现这个操作的过程如下:首先创建一个能容纳10个字符的新字符串,然后在这个字符串中填充“Java”和“Script”,最后一步是销毁原来的字符串“Java”和“Script”,因为这两个字符串已经没用了。但是在低版本的浏览器(如IE6)中,字符串拼接速度是很消耗一个性能的过程。

    由此我就联想到了Java,在Java中的字符串机制也和js差不多(即创建了就不能改变,要改变只能销毁原来的值),但是Java有个StringBuffer解决了字符串不可变的问题,js且没有类似的方法。但是我们可以模拟这种缓冲机制。其原理是利用数组进行拼接,源代码如下:

     

     

     

    复制代码

    function StringBuffer() {
        this.__strings__ = new Array();
    }
    StringBuffer.prototype.append = function (str) {
        this.__strings__.push(str);
        return this;    //方便链式操作
    }
    StringBuffer.prototype.toString = function () {
        return this.__strings__.join("");
    }

    复制代码

     

     

     

    /*测试*/
    var buffer = new StringBuffer();
    buffer.append("Hello ").append("javascript");
    
    var result = buffer.toString();
    alert(result); 

     

     

     ps:gist地址如下:https://gist.github.com/hehongwei44/fe71f10e4d2d9295aeab

    机制我们模拟出来了,但是这个方法和字符串拼接性能上有多少差别了,我们可以测试一下,测试代码如下:

     

     

    复制代码

    var d1 = new Date();
    var str = "";
    for(var i = 0; i < 10000; i++){
        str += "text ";
    }
    var d2 = new Date();
    document.write("测试一花费: " + (d2.getTime() - d1.getTime())/1000 + "秒"+"<br/>");
     
    
    var oBuffer = new StringBuffer();
    d3 = new Date();
    for(var i = 0; i < 10000; i++){
        oBuffer.append("text ");
    }
    var sResult = oBuffer.toString();
    d4 = new Date();
    document.write("测试二花费: " + (d4.getTime() - d3.getTime())/1000 + "秒");

    复制代码

     

     

     

     测试结果如下:(环境不同,测试结果可能不同):

    1 在以1000次为基数的情况下,进行比较,两者执行都非常快(基本都是几毫秒)耗时都差不多,后者以前者相差不会超过10个毫秒。
    2 在以10000次为基数的情况下,执行结果和上面差不多,但是前者在IE6下话费的事件较多。
    3 在以100000次为基数的情况下,字符串拼接在IE6下,明显花的时间更多,其他浏览器相差不大,有的反而比StringBuffer更短。

     

    结论

    1 在拼接词数少于1000次的情况下,大胆的使用前者,一般我们也很少碰到拼接次数上千的情况。
    2 其他浏览器对于拼接都没什么性能问题,主要是IE6,如果拼接次数上万或者十万的话,建议单独对IE6是用StringBuffer模拟。
    展开全文
  • 1、将数组中的所有元素以指定的字符分割拼接为一个字符串——array.join("separator") 直接使用array.join()时,用逗号进行分割 eg:以"."分割数组中的每一个元素var arr = new Array(3) arr[0] = "George" arr[1] =...

    1、将数组中的所有元素以指定的字符分隔拼接为一个字符串——array.join(separator)

    该方法返回一个字符串。

    separator:用于分隔的字符

    不传入分隔符直接使用array.join()时,用逗号进行分割

    eg:以"."分割数组中的每一个元素

    var arr = new Array(3)
    arr[0] = "George"
    arr[1] = "John"
    arr[2] = "Thomas"
    
    document.write(arr.join("."))
    输出:George.John.Thomas


    2、将一个字符串根据指定的分割符进行分割——stringObject.split(separator,limit)

    该方法返回一个由分割结果组成的数组。

    separator:必填参数,字符串或正则表达式,该参数指定的地方分割字符串

    limit:选填参数,分割的次数,填了以后返回的数组长度不会大于这个参数

    eg:

    str="2,2,3,5,6,6"; //这是一字符串 
    var strs= new Array(); //定义一数组 
    strs=str.split(","); //字符分割 
    for (i=0;i<strs.length ;i++ ) 
    { 
    document.write(strs[i]+"<br/>"); //分割后的字符输出 
    } 
    输出:

    2
    2
    3
    5
    6



    3、用连接符“+”把要连接的多个字符串连起来拼成一个。

    str="a";
    str+="b";
    这种方法是最便捷快速的,如果只连接100个以下的字符串建议用这种方法最方便。但是如果拼接的过多,考虑到性能则可以使用join的方法。



    4、根据开始和结束下标截取子字符串——stringObject.substring(start,stop) 。

    start:必需。一个非负的整数,规定要提取的子串的第一个字符在 stringObject 中的位置。

    stop:可选。一个非负的整数,比要提取的子串的最后一个字符在 stringObject 中的位置多 1。如果省略该参数,那么返回的子串会一直到字符串的结尾。 

    返回值 :
    一个新的字符串,该字符串值包含 stringObject 的一个子字符串,其内容是从 start 处到stop-1 (而不是stop处的)处的所有字符,其长度为 stop 减 start。

     
    注意:

    substring 方法返回的子串包括 start 处的字符,但不包括 end 处的字符。
    如果 start 与 end 相等,那么该方法返回的就是一个空串(即长度为 0 的字符串)。
    如果 start 比 end 大,那么该方法在提取子串之前会先交换这两个参数。
    如果 start 或 end 为负数,那么它将被替换为 0。 



    5、截取一个从指定位置开始的指定长度的子字符串。

    ——stringObject.substr(start [, length ]) 。

    start 必需。所需的子字符串的起始位置。字符串中的第一个字符的索引为 0。
    length 可选。在返回的子字符串中应包括的字符个数。 


    注意:
    如果 length 为 0 或负数,将返回一个空字符串。
    如果没有指定该参数,则子字符串将延续到stringObject的最后。 



    6、判断一个字符串中是否包含某个子字符串——stringObject.indexOf(separator)
    separator:被包含的字符串

    返回值:

    返回字符串中匹配子串的第一个字符的下标

    当为-1时,说明该字符串中不包含这个子字符串

    eg:

    var myString=”JavaScript”; 
    var w=myString.indexOf(”v”);w will be 2


    7、返回字符串中的一个给定的字符——charAt()、charCodeAt()

    var stringValue="hello world";
    alert(stringValue.charAt(1));//"e"


    8、将多个字符串拼接起来——contact


    9、

    展开全文
  • 今天在写js的时候碰到了难题,我又一个页面需要生成很的变量。但是变量的名称是根据参数的不同而区分的。 例如可能需要生成 date_1,date_2,datet_3… (后面的数字是根据参数来的)。 所以我的函数名 应该由 var ...
  • 拼接列表 2层循环这里用es6模板字符串 多个参数时,方法名不要加引号 function(res){ hideLoader(); console.log(res) data=res.details; html+=`<div class="folding"><div data-role=...
  • JS中常见的字符串拼接处理

    千次阅读 2016-11-23 21:48:45
    最近动态的编写界面的时候总是需要不定时的用到js,而字符串拼接还有在jsp文件获取后台的数据变量是使用的麻烦,我我碰到的列举一下,希望对以后看到这问题的人有所帮助1. JS获取java后台在jsp中的变量 ...
  •  要将多个字符串累积为个字符串,还可以使用”+=”操作符: var result = ""; result += "My name is Anders" result += " and my age is 25";    要在字符串中添加换行符,需要使用转义字符””: ...
  • js字符串拼接

    2019-05-12 17:45:57
    // 通过字符串拼接 // 点击按钮实现拼接 document.getElementById("btn").onclick = function () { //定义一个空 var str = ""; // 获取全部的文本框值 var inputs = document.getElementsByTagName("input")...
  • //参数拼接 function strconcat() { var arg=arguments; var str=""; if(arg==null){ return str; } for(var i=0;i<arg.l...
  • Js--字符串拼接/连接

    2020-06-10 23:28:19
    Js--字符串拼接/连接 博客说明 文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人删除,谢谢! 说明 在开发的过程中很容易遇到字符串连接的问题,下面列举三种...
  • js多个字符串合并成一个数组

    千次阅读 2020-08-07 21:34:56
    闲话不说了哈,直接上代码 var allArr = [] allArr.push('2020-07-31 21:00') allArr.push("2020-08-07 21:00") allArr.push("2020-08-17 21:00") allArr.join(',') console.log(allArr) ...
  • 当时看完python的基本语法后 给朋友写了美元概率换算 写完后拼接结果时候 发现压根不知道python怎么拼接字符串 看了些资料自己做了总结首先就是和JavaScript一样的拼接方式name = input("name:")age= input('age...
  • 前言前几天无意间买了几节 Python 小课,用到字符串拼接,个人觉得是比较细节的东西,因为在JavaScript属于弱类型语言,两个字符串拼接是不区分类型的;Python 和 C++属于强类型语言所以两个字符串是区分类型的。...
  • jquery拼接ajax 的json和字符串拼接的方法发布于 2017-05-01 17:25:10 | 122 次阅读 | 评论: 0 | 来源: 网友投递jQuery javascript框架jQuery是一个兼容浏览器的javascript框架,核心理念是write less,do more(写...
  • Js动态HTML字符串拼接法加载数据

    千次阅读 2018-12-01 13:20:21
    有时候前端请求获取到了数据,比如是一个要显示的表格数据。 js动态加载显示方法有两种。 1. 动态创建元素,配置属性,加入母元素标签(编码量) 2. HTML字符串拼接,替换为母元素innerHTML(高效) 方法 方法一...
  • Javascript 中的长字符串拼接

    千次阅读 2014-08-02 19:56:26
    Javascript中的长字符串拼接2011-07-11 16:00 佚名 互联昂网 字号:T | T字符串拼接是所有程序设计语言都需要的操作。当拼接结果较长时,如何保证效率就成为一个很重要的问题。C 语言的 strcat 函数直接操作内存...
  • js字符串拼接成json对象

    千次阅读 2019-05-10 16:36:57
    介绍:将json对象["jobcode":"111","goodunits":"000","rejectUnits":"222"],拼 ["period":"111","licensed":"000","sorned":"222"], varproductductionData = [{ "jobCode": "BY...
  • 有时候我们在处理一个字符串的时候,有这样一个需求,如何用2个或多个字符串同时匹配一个字符串并得到匹配结果呢 ?  运行程序上面程序,得到结果如下: 二. 我们有时候还会遇到这样的一个需求,有一些不...
  • 最优雅,高效的javascript字符串拼接

    万次阅读 2016-08-17 08:51:22
    最优雅,高效的javascript字符串拼接
  • js多个字符串,首尾重复进行拼接

    千次阅读 2018-03-16 18:14:30
    字符串数组,字符串之间首尾重复,去除重复部分,进行拼接 var j=0; var isRepeat = null var index = null var res = new Array() var tmp_key2 var tmp_key1 var Repeat = function(ary) { var arr1 = tmp = ...
  • 、concat() 方法用于字符串拼接字符串 let str1 = "abc" let str2 = "123"; let s1 = str1.concat(str2); let s2 = str1.concat(str2, str2); console.log(s1); // abc123 console.log(s2); // abc123123 ...
  • // 判断一个字符串是否由一个子字符串重复次组成 //如果字符串长度为偶数,则分成两份后一定是重复的,以此类推,最多除以len/2次 //为了保证效率,不可能挨个数地除,因此,可以先找出小于len/2的质数,除以质数就...
  • 拼接多个变量,不想用字符串拼接符+,也不想用console.log(...args)依次打印多个参数。 那么有两种解决方法: ES6新特性中的模板字符串 String实例的format()方法。 Demo 模板字符串 var name = "张三"; var age...
  • 今天有非常有趣的事,因为我需要用JS去实现语言,就是我在JS文件里定义了不同...// 然后再JS里尝试将前面的语言简写当成变量,拼接后面的字符串 var lang = 'zh'; var language = lang + '_test'; alert(languag
  • var str='"' + a+'"'; "<span class='zy' onclick='showAuditIssue(" + id + "," + str+")'>提交</span>";
  • js多个input值拼接json字符串 因为自己是小白,在网上查了些方法感觉不太适合自己的需求,最后找到了自己要的那部分,所以记录一下 如果没有form 就可以用下面的两种方法取到input里面的值 方法1: var ID = $(...
  • JS字符串拼接/连接(3种...
  • JavaScript如何实现字符串拼接操作

    千次阅读 2019-12-25 15:47:07
    本文将通过代码实例详细介绍一下JavaScript如何实现字符串拼接操作。 .使用加号()拼接: 加号不但可以实现算数运算,也可以实现字符串拼接操作。 代码实例如下: console.log("爱前端"````"专注全栈大前端"); 上述...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 57,254
精华内容 22,901
关键字:

js把多个字符串拼接成一个字符串