首页>前端教程>JavaScript教程

JavaScript基础4:Strings 及String Methods

字符串是JavaScript中最常用的数据类型,主要用来存储和操作文本,当然,这个文本指的是带有引号的字符。

1、定义一个变量,为其赋值一个字符串,字符串用双引号和单引号包含起来。

var str1="hello world!";
var str2='welcome to China!';
var str3="welcome to 'Chengdu'!"; //单引号和双引号交替使用,只要不配对就可以。
var str4='welcome to "Chengdu"!';

2、如果字符串中要输出带有引号的字符串,则要用转义字符"\"。反斜杠转义字符将特殊字符转换成字符串字符。

var address="我们居住在\"成都\"这个城市。"    //    \"转义成"
var a='It\'s alright.';                    //     \'转义成'
var b="我们把他们叫做\\斜杠青年\\。";      //      \\转义成\

3、太长的代码影响阅读,如果一行代码太长,可以在操作符后换行。

document.getElementById("demo").innerHTML =
"这是一段很长的演示!";

或者在一串字符中,用“+”字符串连接两行代码。

document.getElementById("demo").innerHTML = "这是一段" + 
"很长的演示!";

4、字符串可以是简单的原始类型,也可以是对象。

原始值就是直接存放了值,并没有属性和方法等。

比如:

var x="this is a string";

但是,也可以通过为String创建对象实例的方法创建一个字符串对象。

var y=new String("this is a string");

此时,x的类型是string,y的类型是object。所以x==y,因为值一样,但是x===y则是false,因为类型不一样。创建的两个值一样的字符串对象比较,结果也是false,因为它们是两个不同的对象实例。

注意:在使用字符串的时候,直接赋值给一个变量,而不要通过对象的方式创建,因为会影响执行速度并带来一些意想不到的问题。

那么属性和方法为什么可以用在原始值上?

是因为在JavaScript中,只要引用了字符串(数字、布尔值也是一样的)的属性,JS就会将字符串通过调用new String(s)的方式转换成对象,这个对象继承了字符串的方法,并被用来处理属性的引用。一旦属性引用结束,这个新创建的对象就会销毁(真实实现并不一定是这样,但整个过程看起来是这样)。这个过程就叫包装对象。

5、length属性返回字符串的长度。

var str="this is a string";
var len=str.length;

6、查找字符串的3种方法。

  • indexOf()

  • lastIndexOf()

  • search()

indexOf()返回字符串中第一次出现指定文本的索引位置。

var str="我们正在学习'javascript'这门脚本语言";
var pos=str.indexOf("javascript"); // 7

lastIndexOf()返回字符串中指定文本从右往左第一次出现的索引值。

var str="HTML5是HTML语言的最新版本";
var pos=str.lastIndexOf("HTML"); //6

JavaScript从0开始计算,从左往右,如果找到,返回第一个字符的索引值,没有找到,返回-1。两个方法都可以设置第二个参数作为搜索的起始位置。indexOf是从位置的左边,从左往右查找。lastIndexOf则相反,如果位置是10,则从10的位置从右往左找到字符串的开头,找这一串字符中从右往左第一次出现的字符串。

var str="HTML5是HTML语言的最新版本";
var pos=str.indexOf("HTML",5); //6

var str="HTML5是HTML语言的最新版本";
var pos=str.lastIndexOf("HTML",10); //6

search()方法可以在字符串中搜索指定的值并返回对应的索引位置。

var str="HTML5是HTML语言的最新版本";
var pos=str.search("HTML"); //0

var str="Mr.Blue has a blue house";
var pos=str.search(/blue/i); // 3 正则表达式的写法,表示查找blue,但是忽略大小写。

search()方法不能有第二个起始位置的参数。但可以搜索正则表达式,indexOf()则不行。

7、提取部分字符串的3种方法。

  • slice(start, end)

  • substring(start, end)

  • substr(start, length)

slice() 从初始位置到结束位置(不包括结束位置),提取这部分字符串并返回到新字符串中。

var str="把'城市'提取到新字符串中";
var newStr=str.slice(2,4); //城市

该参数允许负值,如果为负值,则从字符串的结尾开始计算。

var str="苹果,香蕉,橘子";
var newStr=str.slice(-5,-3); //香蕉

如果省略第二个参数,则从起始位置到结束都截取出来。

var str="苹果,香蕉,橘子";
var newStr=str.slice(3); //香蕉,橘子

var str="苹果,香蕉,橘子";
var newStr=str.slice(-5); //香蕉,橘子

注意:IE8及更低版本的浏览器不支持负值的参数。

substring()函数和slice()函数很相似,只是substring()不支持负值的参数。
substr()和slice()也很相似,只是第二个参数表示的是要截取的字符串的长度。第一个参数是起始位置,可以为负值。

var str="苹果,香蕉,橘子";
var newStr=str.substr(3,2); //香蕉

var str="苹果,香蕉,橘子";
var newStr=str.substr(-5); //香蕉,橘子

8、替换字符串。

replace(oldstr,newstr),把字符串中一个指定的值替换成另一个值。

var str="topbar w1200";
var n=str.replace("w1200","w1400"); //topbar w1400

replace()不会改变原来的字符串,它会返回一个新的字符串。

另外,replace()只会替换匹配的第一个字符串。

var str="you and me and me";
var n=str.replace("me","her"); //you and her and me

而且,对大小写敏感。

var str="topBar SLIDE";
var n=str.replace("slide","aside"); //topBar SLIDE

如果不管大小写都匹配,可以加上/i这样的正则表达式的标志。

var str="topBar SLIDE";
var n=str.replace(/slide/i,"aside"); //topBar aside

注意,正则表达式不带引号。

如果需要全局匹配,可以加上/g这样的标志。

var str="you and me and me";
var n=str.replace(/me/g,"her"); //you and her and her

9、大小写转换函数。

toUpperCase()函数把字符转换成大写。

toLowerCase()把字符转换成小写。

var str="Hello World";
var u=str.toUpperCase();
var l=str.toLowerCase();

10、连接字符串方法。

concat()连接两个或多个字符串。和“+”连接字符串运算符相似。

var str1="输出的结果是:";
var str2="100";
var str3=str1.concat(" ",str2,"!");//输出的结果是: 100!

var str3=str1+" "+str2+"!";

所有的字符串方法都不会修改原始字符串,只会返回一个新的字符串。

11、删除字符串两边的空格。

trim()函数删除字符串两边的空格。

var sname="   Daisy   ";
var n=sname.trim(); //Daisy

注意:IE8及更低版本不支持trim()函数。

如果要支持IE8,可以使用replace()和正则表达式。

var str = "       Hello World!        ";
var n=str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');

12、提取字符串字符。

  • charAt(position)

  • charCodeAt(position)

都是返回字符串中指定索引位置的那个字符,charAt()返回字符,charCodeAt()返回字符的unicode码。

ASCII,Unicode和UTF-8终于找到一个能完全搞清楚的文章了

var str="this is my website";
var n=str.charAt("5");// i

var str="this is my website";
var n=str.charCodeAt("5");// 105

13、字符串转换成数组。

split()函数可以将字符串转换成数组。

var str="苹果,香蕉,西瓜";
var n=str.split(","); // ["苹果","香蕉","西瓜"]

var str="school";
var n=str.split(""); //["s","c","h","o","o","l"]

var str="Tom Daisy Susan";
var n=str.split(" "); //["Tom","Daisy","Susan"]

var str="lanzhen is writting";
var n=str.split(); //["lanzhen is writting"]

全部String对象的方法可以查看手册:JavaScript String 对象手册

点赞


2
保存到:

相关文章

Top