高性能JavaScript--字符串加(+)和加等(+=)操作符优化方法

首先看一个例子, 这是一个连接字符串的常用方法.

1
str += "one" + "two";

此代码运行时, 会经历4个步骤:

  1. 在内存中创建一个临时字符串.
  2. 连接后的字符串”onetwo”被赋值给临时字符串.
  3. 临时字符串与str当前的值连接.
  4. 结构赋值给str
    这是浏览器完成此任务的大概步骤.

以下代码在大多数浏览器中这样做会提速10%-40%;

1
str = str + "one" + "two"

赋值表达式由str开始作为基础, 每次给它附加一个字符串, 从左向右依次连接, 因此避开了临时字符串. 如果改变连接顺序(例如: str = “one” + str + “two”). 本优化将失效. 这与浏览器合并字符串时分配的内存方法有关. 除IE外, 其他浏览器会尝试为表达式左侧的字符串分配更多的内存. 然后简单地将第二个字符串拷贝至它的末尾. 如果在一个循环中, 基础字符串位于最左端的位置, 就可以避免重复拷贝一个逐渐变大的字符串,

这项技术不适用IE

越来越多的平台(微信公众平台,新浪微博,简书,百度打赏等)支持打赏功能,付费阅读时代越来越近,特此增加了打赏功能,支持微信打赏和支付宝打赏。坚持原创技术分享,您的支持将鼓励我继续创作!