javascript框架设计读书笔记之字符串的扩展和修复

 更新时间:2014年12月02日 16:33:38   投稿:hebedich  
本文是司徒正美的《javascript框架设计》的第三章第一节的读书笔记,简单介绍了javascript字符串的扩展和修复,小伙伴们参考下吧

1.repeat方法:将一个字符串重复自身n次。比如:repeat("chaojidan",2)   -> chaojidanchaojidan

方法1:

复制代码 代码如下:

function repeat(str,n){
  return Array.prototype.join.call({length:n+1},str); 
//在类数组{length:n+1}上下文下执行join方法,并传入str。也就是用str来分隔类数组的选项,类数组是空,所以就有n个str分隔n+1个"",得到的结果就是n个str连接。
}

方法2:

复制代码 代码如下:

function repeat(str,n){
  var s = str ,total = "";
  while(n>0){             
//假设n是5,n%2后,等于1,因此total = str.s=strstr。n=2.第二次循环:s=strstrstrstr,n=1.第三次循环total = strstrstrstrstr,break,跳出循环,返回total,刚好是str重复了5次的字符串
    if(n%2 ==1){    
      total + =s;     //这里是2的0次方,也就是1,所有的正整数,都可以使用1,2,4,8....进行组合。比如:3=1+2,5=1+4,7=1+2+4.
    }
    if(n==1)  break;
    s+=s;    //这里利用的是2的幂次方,2,4,8.....
    n = n>>1;
  }
  return total ;
}

2.取字符串所有字节的长度:str.charCodeAt(i) >255 就把str的长度加一次就OK了.

3.转换驼峰风格:str.replace(/[-_][^-_]/g,function(match){return match.charAt(1).toUpperCase();}) 

//-_在[]中,不需要使用\,并且^在[]中是代表反的意思,就是遇到-a或_a,就被替换成A(match就是正则匹配的字符串_a,然后取a,并且大写)

4.转换为下划线风格:str.replace(/([a-z\d])([A-Z])/g,'$1_$2').replace(/\-/g,'_').toLowerCase();

//第一个replace,匹配cA,或者4A的字符串,然后用c_A或4_A替换。$1代表第一个子表达式。第二个replace就是使用_替换-。由于-不在[]中,所以需要加\。

5.去掉字符串中的html标签:str.replace(/<[^>]+>/g,''),这里面会把script标签去掉,但是不会去掉script中的js脚本

6.去掉script标签,并且移除里面的js脚本:str.replace(/<script[^>]*>(\S\s)*?)<\/script>/img,'')     

 /需要用\,防止转义。

//(\S\s)*?)尽可能少的匹配,非贪婪匹配。举个例子:<script>aaa</script>dddd<script>bbbb</script>,会先匹配<script>aaa</script>,再匹配<script>bbbb</script>,如果没加?,将是贪婪匹配,将会把<script>aaa</script>dddd<script>bbbb</script>全部匹配掉,连字符串dddd都去掉了。

7.将字符串经过html转义,得到适合在页面中显示的内容.

str.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;').replace(/'/g,'&#39;');

8.将字符串的html实体字符换成对应字符:

跟7相反,只是多了一个replace(/&#([\d]+);/g,function($0,$1){  return String.fromCharCode(parseInt($1,10))  })   //$1就是第一个子表达式匹配项。

9.trim:str.replace(/^\s+ | \s+$/g,'')   ,IE或早期的标准浏览器,把许多本属于空白的字符没有列为\s中,因此会有bug。不过,又何必执着兼容淘汰的浏览器呢。

相关文章

  • Js 代码中,ajax请求地址后加随机数防止浏览器缓存的原因

    Js 代码中,ajax请求地址后加随机数防止浏览器缓存的原因

    Js 代码中,ajax请求地址后加随机数防止浏览器缓存的原因,需要的朋友可以参考一下
    2013-05-05
  • Three光源Target位置改变光照方向不变的问题解决方法

    Three光源Target位置改变光照方向不变的问题解决方法

    这篇文章主要为大家介绍了Three光源Target位置改变光照方向不变的问题及解决方法,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-12-12
  • JS小球抛物线轨迹运动的两种实现方法详解

    JS小球抛物线轨迹运动的两种实现方法详解

    这篇文章主要介绍了JS小球抛物线轨迹运动的两种实现方法,结合实例形式分析了javascript实现小球抛物线运动的相关计算与图形绘制操作技巧,需要的朋友可以参考下
    2017-12-12
  • JS实现超简单的汉字转拼音功能示例

    JS实现超简单的汉字转拼音功能示例

    这篇文章主要介绍了JS实现超简单的汉字转拼音功能,结合实例形式分析了javascript汉字转换成拼音的函数定义与使用技巧,需要的朋友可以参考下
    2016-12-12
  • 使用微信内嵌H5网页解决JS倒计时失效问题

    使用微信内嵌H5网页解决JS倒计时失效问题

    最近参考项目开发,遇到这样一个需求将H5商城页面嵌套到公司微信公众号里,在开发遇到一个棘手的问题,js倒计时失效问题,怎么回事呢?下面说下我使用微信内嵌h5解决的这一问题,需要的朋友参考下吧
    2017-01-01
  • js实现前端界面导航栏下拉列表

    js实现前端界面导航栏下拉列表

    这篇文章主要为大家详细介绍了js实现前端界面导航栏下拉列表,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-08-08
  • Worker加载JS脚本跨域问题的几种解决方法

    Worker加载JS脚本跨域问题的几种解决方法

    Web Worker 是一种在后台线程中运行的 JavaScript 脚本,允许我们在不阻塞主线程的情况下执行复杂计算或处理,Worker 加载的 JS 脚本如果存在跨域问题,可能导致脚本无法正常加载和执行,以下是解决 Worker 加载 JS 脚本跨域问题的几种方法,需要的朋友可以参考下
    2025-02-02
  • JavaScript多种页面刷新方法小结

    JavaScript多种页面刷新方法小结

    这篇文章主要介绍了JavaScript多种页面刷新方法小结,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-04-04
  • JS如何生成随机验证码

    JS如何生成随机验证码

    这篇文章主要为大家详细介绍了JS如何生成随机验证码,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-03-03
  • JavaScript是如何实现继承的(六种方式)

    JavaScript是如何实现继承的(六种方式)

    大多OO语言都支持两种继承方式: 接口继承和实现继承 ,而ECMAScript中无法实现接口继承,ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现,下文给大家技术js实现继承的六种方式,需要的朋友参考下
    2016-03-03

最新评论