资讯专栏INFORMATION COLUMN

JavaScript的字符串拼接、截取

keithyau / 2900人阅读

摘要:字符串拼接作为前端工程师,大部分时间在和业务作斗争,当然可能有一些例外,不过大体如是,而在处理业务时总会和字符串打交道,而字符串的拼接和截取是无法避免的,这里对这些部分进行一些探索。返回值提取的字符串语法参数值必需。子串中的字符数。

JavaScript字符串拼接

作为前端工程师,大部分时间在和业务作斗争,当然可能有一些例外,不过大体如是,而在处理业务时总会和字符串打交道,而字符串的拼接和截取是无法避免的,这里对这些部分进行一些探索。

JavaScript字符串拼接

目前本文打算探索的方法包括:

+=

Array.prototype.join【数组】

String.prototype.concat [字符串]

这是比较常见的方法;代码如下:

var arrayTest = [];
for(var i=0;i<1000000;i++){
    arrayTest.push(i);
}

//test += used time
var startTimex,
    endTimex,
    resx;
startTimex = new Date().getTime();
for(var x=0, xlen=arrayTest.length; x

运行测试只是使用了firefox、chrome、safari;结果如下:

chrome测试结果:

firefox结果:

safari结果:

由于测试的浏览器都比较的新,所以上面的结果表明是join的方法还是效率要高点,不过这是在庞大的数据拼接上体现的,一般业务也不会有这么大的拼接,所以其实这个问题已经不大了,没有必要进行特意的注意。

字符串的截取

使用的方法是slice、substr、substring 三种方法;

slice:

使用方法:string.slice(start,end)
参数说明
start 必须. 要抽取的片断的起始下标。第一个字符位置为 0
end 可选。 紧接着要抽取的片段的结尾的下标。若未指定此参数,则要提取的子串包括 start 到原字符串结尾的字符串。如果该参数是负数,那么它规定的是从字符串的尾部开始算起的位置。
返回值:String 提取的字符串

substr

语法: string.substr(start,length)
参数值
start 必需。要抽取的子串的起始下标。必须是数值。如果是负数,那么该参数声明从字符串的尾部开始算起的位置。也就是说,-1 指字符串中最后一个字符,-2 指倒数第二个字符,以此类推。
length 可选。子串中的字符数。必须是数值。如果省略了该参数,那么返回从 stringObject 的开始位置到结尾的字串。
返回值
String A new string containing the extracted part of the text

substring

语法:string.substring(from, to)
参数
from 必需。一个非负的整数,规定要提取的子串的第一个字符在 string Object 中的位置。
to 可选。一个非负的整数,比要提取的子串的最后一个字符在 string Object 中的位置多 1。
如果省略该参数,那么返回的子串会一直到字符串的结尾。

区别

三个方法之间的主要区别如下:

三个方法的参数1都代表子串开始位置,参数2在slice和substring中表示结束位置,而在substr中代表的则是子串长度;

对于负数态度,当出现在参数1的位置时,slice和substr从末尾开始计算,而substring不支持末尾计数法直接视为0;当出现在参数2位置时,slice和substring的处理同参数1:前者从末尾开始计算,后者转换成0,而substr则视负数长度为0返回空串;

对于参数1小于参数2的情况,substring最大的不同在于它会交换两个参数再截取子串,substr因第二参数表示的是长度因此并无异常,slice曽依然正常搜寻子串始末位置,若开始位置在结尾后边则返回空串。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/84013.html

相关文章

  • JavaScript Array 整理 - 元素操作

    摘要:此文章是我的原创文章,原文地址前篇整理了一些常用的遍历操作方法,今天再整理一下对象中针对元素操作的方法。返回当前数组最后一个元素描述返回数组第一个元素,并从当前数组中删除它。删除的元素组成的数组 此文章是我的原创文章,原文地址:http://lpgray.me/article/49/ 前篇整理了一些Array常用的遍历操作方法,今天再整理一下Array对象中针对元素操作的方法。 分别是...

    phodal 评论0 收藏0
  • javascript string 方法总结

    摘要:字符方法接收一个参数,基于的字符位置。返回的是字符编码。方法这个方法会创建一个字符串的副本,删除前置及后缀的所有空格,然后返回结果。方法这个方法的任务是接收一个或者多个字符编码,然后将它们转换成一个字符串。 字符方法 1、charAt()接收一个参数,基于0的字符位置。以单字符串的形式返回给定位置的那个字符。 var stringValue = hello world; c...

    lk20150415 评论0 收藏0
  • JavaScript常用数组方法——ES3

    摘要:功能将数组元素通过指定的字符连接成字符串参数拼接字符串返回值拼接后的字符串注意数组本身不发生变化无参数时,默认用连接用连接功能将数组元素颠倒顺序参数无注意操作的是数组本身,数组元素颠倒功能将数组元素排序参数比较函数注意操作的是数 join(sep) 功能:将数组元素通过指定的字符连接成字符串 参数: sep:拼接字符串 返回值:拼接后的字符串 注意:数组本身不发生变化 v...

    YPHP 评论0 收藏0
  • JavaScript 基础知识 - 入门篇(二)

    摘要:函数可以没有返回值,会在最后面返回一个。事物的行为在对象中用方法来表示。 11. 函数 11.1 函数的基础知识 为什么会有函数? 在写代码的时候,有一些常用的代码需要书写很多次,如果直接复制粘贴的话,会造成大量的代码冗余;函数可以封装一段重复的javascript代码,它只需要声明一次,就可以多次调用; 冗余代码: 冗余:多余的重复或啰嗦内容 缺点: 代码重复,可阅读性差 ...

    niuxiaowei111 评论0 收藏0
  • Javascript ECMA-1(数据类型,符串操作)

    摘要:基础建议一般情况下不在标签中写语句,因为该语句会在加载之前就执行,可能导致某些效果无效单行注释多行注释控制台输出语句浏览器的提示框这是一个提示框页面展示数据类型一基本数据类型数字类型整型浮点型不是一个数字不能处理的数字字符串,使用单引号或双 1.js基础 建议:一般情况下不在head标签中写js语句,因为该js语句会在body加载之前就执行,可能导致某些效果无效 // 单行注释 /*多...

    DataPipeline 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<