1、字符串转换

字符串转换是最基础的要求和工作,你可以将任何类型的数据都转换为字符串,你可以用下面三种方法的任何一种:

var num= 19; //
var myStr = num.toString(); // "19"

你同样可以这么做:

var num= 19; //
var myStr = String(num); // "19"

或者,再简单点儿:

var num= 19; //
var myStr = "" +num; // "19"

2、字符串分割

字符串分割,即将一个字符串分割为多个字符串,JavaScript中给我们提供了一个非常方便的函数,如:

var myStr = "I,Love,You,Do,you,love,me";
var substrArray = myStr .split(","); // ["I", "Love", "You", "Do", "you", "love", "me"];
var arrayLimited = myStr .split(",", 3); // ["I", "Love", "You"];

split()的第二个参数,表示返回的字符串数组的最大长度。

3、获取字符串长度

字符串长度是在开发中经常要用到的,非常简单如下:

var myStr = "I,Love,You,Do,you,love,me";
var myStrLength = myStr.length; //

4、查询子字符串

很多人都会忘记这几个JavaScript的自带的方法,或者忘记它们的具体用法,从而导致在做题的时候不得不嵌套for循环来做。

第一个函数:indexOf(),它从字符串的开头开始查找,找到返回对应坐标,找不到返回-1。如下:

var myStr = "I,Love,you,Do,you,love,me";
var index = myStr.indexOf("you"); // 7 ,基于0开始,找不到返回-1

第二个函数:lastIndexOf(),它从字符串的末尾开始查找,找到返回对应坐标,找不到返回-1。如下:

var myStr = "I,Love,you,Do,you,love,me";
var index = myStr.lastIndexOf("you"); //

以上两个函数同样接收第二个可选的参数,表示开始查找的位置。

5、字符串替换

单单查到字符串应该还不会停止,一般题目都还经常会遇到让你查到并替换为你自己的字符串,例如:

var myStr = "I,love,you,Do,you,love,me";
var replacedStr =myStr.replace("love","hate")//"I,hate,you,Do,you,love,me"

默认只替换第一次查找到的,想要全局替换,需要置上正则全局标识,如:

var myStr = "I,love,you,Do,you,love,me";
var replacedStr = myStr.replace(/love/g,"hate");//"I,hate,you,Do,you,hate,me"

6、查找给定位置的字符或其字符编码值

想要查找给定位置的字符,你可以使用如下函数:

var myStr = "I,love,you,Do,you,love,me";
var theChar = myStr.charAt(8);// "o",同样从0开始

同样,它的一个兄弟函数就是查找对应位置的字符编码值,如:

var myStr = "I,love,you,Do,you,love,me";
var theChar = myStr.charCodeAt(8); //

7、字符串连接

字符串连接操作可以简单到用一个加法运算符搞定,如:

var str1 = "I,love,you!";
var str2 = "Do,you,love,me?";
var str = str1 + str2 + "Yes!";//"I,love,you!Do,you,love,me?Yes!"

同样,JavaScript也自带了相关的函数,如:

var str1 = "I,love,you!";
var str2 = "Do,you,love,me?";
var str = str1.concat(str2);//"I,love,you!Do,you,love,me?"

其中concat()函数可以有多个参数,传递多个字符串,拼接多个字符串。

8、字符串切割和提取

有三种可以从字符串中抽取和切割的方法,如:

第一种,使用slice():

var myStr = "I,love,you,Do,you,love,me";
var subStr = myStr.slice(1,5);//",lov"

第二种,使用substring():

var myStr = "I,love,you,Do,you,love,me";
var subStr = myStr.substring(1,5); //",lov"

第三种,使用substr():

var myStr = "I,love,you,Do,you,love,me";
var subStr = myStr.substr(1,5); //",love"

与第一种和第二种不同的是,substr()第二个参数代表截取的字符串最大长度,如上结果所示。

9、字符串大小写转换

常用的转换为大写或者小写字符串函数,如下:

var myStr = "I,love,you,Do,you,love,me";
var lowCaseStr = myStr.toLowerCase();//"i,love,you,do,you,love,me";
var upCaseStr = myStr.toUpperCase();//"I,LOVE,YOU,DO,YOU,LOVE,ME"

10、字符串匹配

字符串匹配可能需要你对正则表达式有一定的了解,先来看看match()函数:

var myStr = "I,love,you,Do,you,love,me";
var pattern = /love/;
var result = myStr.match(pattern);//["love"]
console.log(result .index);//
console.log(result.input );//I,love,you,Do,you,love,me

如你所见,match()函数在字符串上调用,并且接受一个正则的参数。来看看第二个例子,使用exec()函数:

var myStr = "I,love,you,Do,you,love,me";
var pattern = /love/;
var result = pattern .exec(myStr);//["love"]
console.log(result .index);//
console.log(result.input );//I,love,you,Do,you,love,me

简单吧,仅仅是把正则和字符串换了个位置,即exec()函数是在正则上调用,传递字符串的参数。对于上面两个方法,匹配的结果都是返回第一个匹配成功的字符串,如果匹配失败则返回null.

再来看一个类似的方法search(),如:

var myStr = "I,love,you,Do,you,love,me";
var pattern = /love/;
var result = myStr.search(pattern);//

仅返回查到的匹配的下标,如果匹配失败则返回-1.

11、字符串比较

比较两个字符串,比较是规则是按照字母表顺序比较的,如:

var myStr = "chicken";
var myStrTwo = "egg";
var first = myStr.localeCompare(myStrTwo); // -1
first = myStr.localeCompare("chicken"); //
first = myStr.localeCompare("apple"); //

12、举例

最后我们来看一道前端笔试题,去哪儿网的,相信很多同学都做到过这个题了。题目:写一个getSuffix函数,用于获得输入参数的后缀名,例如输入abcd.txt,返回txt。附上我的答案:

function getSuffix(file){
      return file.slice(file.lastIndexOf(".") + 1,file.length);
}

以上这些操作是用的比较多的,也是比较重要的,欢迎大家补充学习!

JavaScript初探系列之String的基本操作的更多相关文章

  1. JavaScript初探系列之数组的基本操作

    在程序语言中数组的重要性不言而喻,JavaScript中数组也是最常使用的对象之一,数组是值的有序集合,由于弱类型的原因,JavaScript中数组十分灵活.强大,不像是Java等强类型高级语言数组只 ...

  2. JavaScript初探系列目录

    一  系列导航 结合各方面的参考资料,整理出来以下主要目录,供方便浏览查看 (一)初探系列           JavaScript初探系列(1)——基本概念 JavaScript初探系列(2)——数 ...

  3. JavaScript初探系列之面向对象

    面向对象的语言有一个标志,即拥有类的概念,抽象实例对象的公共属性与方法,基于类可以创建任意多个实例对象,一般具有封装.继承.多态的特性!但JS中对象与纯面向对象语言中的对象是不同的,ECMA标准定义J ...

  4. JavaScript初探系列之Ajax应用

    一 什么是Ajax Ajax是(Asynchronous JavaScript And XML)是异步的JavaScript和xml.也就是异步请求更新技术.Ajax是一种对现有技术的一种新的应用,不 ...

  5. JavaScript初探系列之基本概念

    JavaScript的核心语言特性在ECMA-262中是以名为ECMAScript(ECMA, EuropeanComputer Manufacturers Association )的伪语言的形式来 ...

  6. JavaScript初探系列之日期对象

    时间对象是一个我们经常要用到的对象,无论是做时间输出.时间判断等操作时都与这个对象离不开.它是一个内置对象——而不是其它对象的属性,允许用户执行各种使用日期和时间的过程. 一   Date 日期对象 ...

  7. JavaScript初探系列(十)——Event

    一.绑定事件的两种方式 (一).方式一:onclick 举例: <body> <button>点我</button> <script> var btn ...

  8. JavaScript初探系列(十一)——ES6

    一.前言 ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在 2015 年 6 月正式发布了.它的目标,是使得 JavaScript 语言可以用来编写复 ...

  9. JavaScript初探系列(九)——BOM

    一.什么是BOM? BOM:Browser Object Model 是浏览器对象模型,浏览器对象模型提供了独立与内容的.可以与浏览器窗口进行互动的对象结构,BOM由多个对象构成,其中代表浏览器窗口的 ...

随机推荐

  1. 理解Redux以及如何在项目中的使用

    今天我们来聊聊Redux,这篇文章是一个进阶的文章,建议大家先对redux的基础有一定的了解,在这里给大家推荐一下阮一峰老师的文章: http://www.ruanyifeng.com/blog/20 ...

  2. HTML5之特效

    2D转换 在二维的平面上做一些变化,使用transform属性 1. 2D转换之移动(translate) 案例: div{ width: 200px; height: 200px; backgrou ...

  3. TypeScript : 语法及特性

    当let声明一个变量的时候它使用的词法作用域或者是块作用域.块作用域指的就是他们包含的块以外的不能访问. const声明:是let声明有相同的作用域规则,但是它被赋值后不能再被改变.类似于java的f ...

  4. Linux的基础命令大全

    linux的基础命令大全 1.shell是系统的用户界面,提供了用户与内核进行交互操作的一种接口(命令解释器) ls -al /bin/sh   ls -al /bin/bash 查看这些shell的 ...

  5. C指针(4)——数据结构中指针的应用(非常重要)

    5-1动态内存分配,分配的是堆内存的空间 分配内存函数 (都集中在库函数 stdlib.h  中) void *malloc (unsigned int num_bytes); //指定分配内存空间大 ...

  6. 使用Goland同步远程代码

    新版本的goland貌似已经有了Deployment功能,故本篇文章描述的方法也不推荐使用了 以前写php时候习惯使用phpstorm这个编译器,除去本身功能强大不说,比较方便的是其自身带的Deplo ...

  7. CodingLabs - MySQL索引背后的数据结构及算法原理

    原文:CodingLabs - MySQL索引背后的数据结构及算法原理 首页 | 标签 | 关于我 | +订阅 | 微博 MySQL索引背后的数据结构及算法原理 作者 张洋 | 发布于 2011-10 ...

  8. JavaScript---设计模式之职责链模式

    概念 职责链模式是使多个对象都有机会处理请求,从而避免请求的发送者和接受者之间的耦合关系.将这个对象连成一条链,并沿着这条链传递该请求,直到有一个对象处理他为止. 链中收到请求的对象要么亲自处理它,要 ...

  9. CSS布局遇到的问题小结

    clear属性的作用 指定某个元素的一侧不能出现浮动元素.它是通过为这个元素在上边距之外增加空间,从而使得这个元素的顶部和浮动元素的底部对齐.这里作用的仅仅是同一个bfc下的浮动元素. This pr ...

  10. 一次简单的C++编译错误

    快要下班的时候,开发部的一名小鲜肉找我帮忙解决一个问题: 才哥,我们提供给计费组的库在计费主机上编译报错了,但是提供给其他组用时没有编译报错.计费也不认,说编译器报的是我们代码上的错误,要我解决,帮我 ...