element 方法返回的boolean被当成字符串了_重温JavaScript(lesson18):字符串和String

大家好，我们一起重温JavaScript。上次我们学习了数字和Number构造函数相关的内容，今天我们学习字符串以及String构造函数的内容。

1.字符串的基本表示

在JS中字符串是指由一对双引号或者单引号包裹起来的值。在一个字符串前使用typeof操作符会返回'string'。

let s = "new name"console.log(typeof s)// string

字符串中可以包含数字，例如：

let s = '1'console.log(typeof s)// string

如果引号之间没有任何东西，它所表示的依然是一个字符串，我们把它叫做空字符串：

let s = ''console.log(typeof s)//string

对两个字符串使用加号(+)时，做的是字符串的拼接操作，返回两个字符串拼接之后的结果：

let s1 = 'new'let s2 = 'name'let s = s1 + s2;console.log(s)// newnameconsole.log(typeof s)// string

2.字符串的转换

2.1 字符串转换为数字

当我们将一个数字字符串用于算数运算中的操作数时，该字符串会在运算中被当作数字类型来使用。(注意：加法操作符除外)

let s = '1's = 2*sconsole.log(s)// 2console.log(typeof s)// number

再看另外一个例子：

let s = '1's++console.log(s)// 2console.log(typeof s)// number

基于这个例子，我们想到了一个将数字字符串转换为数字的一个简便方法：只需将该数字字符串和1相乘即可。

我们再来看一下刚刚说的加法操作符的例外情况：

let s1 = '1'let s2 = s1 + 5let s3 = 5 + s1console.log(s2)// 15console.log(typeof s2)// stringconsole.log(s3)// 51console.log(typeof s3)// string

这里，数字字符串和数字相加得到的结果是一个新的数字字符串，而不是数字。

2.2 数字转换为字符串

将数字转换为字符串也有一种简便的方法：只需将数字和空字符串相加即可。看例子：

let num = 1console.log(num)// 1console.log(typeof num)// numberlet str = num + ''console.log (str)// 1console.log(typeof str)// string

3.特殊字符串

js中一些字符串是具有特殊含义的，比如\就是转义字符，例如当我们想在单引号包起来字符串中使用单引号就要对其进行转义：

let str = 'I don\'t like js,怎么可能'console.log(str)// I don't like js,怎么可能

除此之外一些常见的有特殊意义的字符串还有 \n(换行符) \t(制表符) \r(回车符) 等。

4.String构造器

可以通过String()构造器函数来新建String对象，但是最好还是使用基本的字符串类型。下面通过一个字来看看String对象和基本的字符串之间的区别：·

let str1 = 'hello'console.log(typeof str1)//stringlet str2 = new String('hello')console.log(typeof str2)//object

String对象实际上就像是一个字符串数组，其中也包括用于每个字符的索引属性，以及整体的length属性。

console.log(str2[0])//hconsole.log(str2[4])//0console.log(str2.length)//5

如果想获得String对象的基本类型值，可以调用该对象的valueOf()或者toString()方法，不过一般很少这么做，因为大部分情况下，String对象都会被自动转换为基本类型的字符串。

console.log(str2.valueOf())//helloconsole.log(str2.toString())//helloconsole.log(str2+"")//hello

当我们将一个基本字符串当作对象使用时，后台就会相应地创建String对象，在调用完之后又把String对象给立即销毁。

console.log('hello'.length)//5console.log('hello'[4])//o

那么基本字符串与String对象之间的区别是什么呢？当它们被转换成布尔值时，尽管空字符串属于falsy值，但是所有的String对象都是truthy值。(因为所有的对象都是truthy值)。

console.log(Boolean(''))//falseconsole.log(Boolean(new String("")))//true

与Number和Boolean类似，如果不通过new操作符来调用String(),它会试图将其转换为一个基本的字符串。如果参数是一个对象的话，这就等于调用该对象的toString()方法。

let str3 = String('hello')console.log(typeof str3)//stringconsole.log(String({name: 'new_name'}))// [object Object]console.log(String([1,2,3]))// 1,2,3

5.String对象的一些方法

5.1 转换

下面看一下String对象的一些方法，首先是字符串转换的方法，toUpperCase()和toLowerCase()，分别将字符串转换为大写和小写:

let strObj = new String('new_name')let strObj2= strObj.toUpperCase()console.log(strObj2)//NEW_NAMElet strObj3 = strObj2.toLowerCase()console.log(strObj3)//new_name

5.2 索引

charAt()返回指定位置的字符，这和中括号[]的作用一样：

let strObj = new String('new_name')console.log(strObj.charAt(0))// nconsole.log(strObj[0])// n

indexOf()方法方法可以实现字符串的搜索，遇到匹配的字符时会返回第一次匹配位置的索引值，注意索引值是从0开始的。

let strObj = new String('new_name')console.log(strObj.indexOf('n'))// 0

也可以通过传递第二个参数使其从指定位置开始搜索：

let strObj = new String('new_name')console.log(strObj.indexOf('n',2))// 4

indexOf()方法不仅可以搜索字符，也可以搜索字符串：

let strObj = new String('new_name')console.log(strObj.indexOf('name'))// 4

注意搜索的时候如果没有搜到则返回-1，所以当我们用if语句检测一个字符串是否包含另外一个字符串时，要用-1来比较：

let strObj = new String('new_name')console.log(strObj.indexOf('Name'))// -1

如果想让字符串从末尾开始搜索可以使用lastIndexOf()方法：

let strObj = new String('new_name')console.log(strObj.lastIndexOf('n'))// 4

5.3 子串

接下来我们看一下slice()和substring()方法，这两个方法都用来返回字符串中指定的区间：

let strObj = new String('new_name')console.log(strObj.slice(0,3))//newconsole.log(strObj.substring(0,3))//new

注意：slice(a,b) 相当于[a,b)，也就是说是左闭右开的区间，包括位置a的字符，但是不包括位置b的字符。

slice()和substring()的区别在于对参数为负值的处理：substring()会将负值当作0处理，slice()则会将此负值和字符串的长度相加。

let strObj = new String('new_name')console.log(strObj.substring(1,-1))//nconsole.log(strObj.slice(1,-1))//ew_nam

5.4 分割、合并

split()方法可以根据我们所传递的参数分割字符串，将目标字符串分割成一个数组。例如：

let strObj = new String('new_name')let strArr = strObj.split('_')console.log(strArr)//["new", "name"]

cancat()方法用于字符串的合并，它的功能和+比较类似：

let strObj1 = new String('new')console.log(strObj1.concat('_name'))//new_name

关于String对象的其他方法，就得老铁们自己去解锁了，我们今天就到这里，来一张导图回顾一下我们重温的内容：

我们这次的分享就到这里，下次再会。如有错误，请不吝指正。温故而知新，欢迎和我一起重温旧知识，攀登新台阶~

重温JavaScript(lesson17):数字和Number构造函数

重温JavaScript(lesson16):Boolean与布尔值

重温JavaScript(lesson15):面向对象(7)

重温JavaScript(lesson14):面试题专辑1

重温JavaScript(lesson13):面向对象(6)

重温JavaScript(lesson12):面向对象(5)

重温JavaScript(lesson11):面向对象(4)

重温JavaScript(lesson10):面向对象(3)

重温JavaScript(lesson9):面向对象(2)

重温JavaScript(lesson8):面向对象(1)

重温JavaScript(lesson7):函数(3)

重温JavaScript(lesson6):函数(2)

重温JavaScript(lesson5):函数(1)

重温JavaScript(lesson4):作用域和闭包(2)

重温JavaScript(lesson3):作用域和闭包(1)

重温JavaScript(lesson2):关于ES6中的const

重温JavaScript(lesson1): 关于ES6中的let