通过实例深入的了解javascript -- 字符串

字符串

字符串之间的比较

字符串进行比较的几种方式:

  • 使用==(==是只比较运算数) 或者是 === (===在比较运算数时,也比较运算类型)
var a = '1'
var b = 1
console.log(a==b)//true
console.log(a===b)//false
  • !=和!==

    i= 仅仅只是指运算数不同,而!==是指数据类型也不相同

var a = '1'
var b = 1
console.log(a!=b) // false
console.log(a!==b)//true
  • <、>=、>、<=

在字符串中进行大小比较实际上是进行ascII码进行比较的,是从等式两端的字符串中,各取第一位进行计算的,如果第一位相等,再向后进行比较

var a = 'abc'
var b = 'Abc'
var c = 'acb'
var d = 'aaaaaaaaaa'
console.log(a>b)//false
console.log(c>a)//true
console.log(a>d)//true

还可以发现,其实两个字符串之间进行大小比较的时候,跟字符串的长度其实关系是不大的,除非短的字符串和长的前几位完全相同时,长度较长的字符串更大

  • localeCompare

接下来我们要介绍一种比较少用,但是却很强的方法,a.localeCompare(b)方法,该方法返回三个值,-1,0,1,这三个值分别代表了ab

很多人觉得这种方法不是很实用,但是这种方法可以让我们直接分辨出两个字符串的关系,但是这种方法仅适用于两个字符串进行比较,number类型和bool以及其他类型不可以

在字符串中查找字符串

在字符串中查找字符串一般会使用到a.indexOf(b)的方法,得到的返回结果是一个整数,代表着我们搜索的字符串的下标,如果为-1则代表不存在

indexOf接受两个参数,第一个参数是我们需要进行搜索的字符串,第二个是开始搜索的位置,从左往右数

indexOf是从左往右进行查找的,那么有没有从右往左的字符串查找方式呢,答案是有的, lastIndexOf就是一种从右往左的查找方法,不过返回的结果也是字符串的下标

lastIndexOf在这个地方有一些难懂的地方,首先lastIndexOf是从右向左进行查找的,其次,他的第二个参数所穿的位置,则是根据从左往右的进行计算,在这里我们依然可以理解为下标,只是我们在进行查找的时候,不再查找这个字符串下标的右边,而是他的左边,我们通过一段代码来进行分析

let a = 'this is a apple,is my apple'
console.log(a.lastIndexOf('apple')) // 22
console.log(a.lastIndexOf('apple',5))//-1
console.log(a.lastIndexOf('apple',10))//10
console.log(a.lasetindexOf('apple',a.length-1))//22

其实可以发现很多很好玩的地方,首先a字符串中存在有两个apple,第一个apple的首字母位置为10,第二个apple的首字母位置为22,当我们进行倒序检查的时候,得到的也还是从左往右的单词下标, 第二个有意思的地方就是,我们发现其实第一个apple的位置在a[10]-a[14]是由五个字符组成的,但是当我们把位置放在a[10]开始进行查询时,我们实际上是对’this is a a’,进行查询的,我们得不到apple,但是因为a[10]为apple的首字母,所以我们依然把10这个位置视为一个‘apple’,由此可以发现,indexOf是将我们传入第二个参数之前的所有全部已查到的结果进行忽略,然后在所有结果中,输出符合该条件的第一个,而不是将字符串进行截取再进行查询

从一个字符串中提取字符串

假设有一个句子是以’:‘开头,以’.'结尾的,我们要将这个句子从字符串中提出来,需要怎么做

    const a = 'this is a string. this string is:orange,apple,pear.'
    const start = a.indexOf(':')
    const end = a.indexOf('.',start+1)
    if (start==-1 && end==-1) {
        return
    }
    console.log(a.substring(start+1,end));//orange,apple,pear
    console.log(a.substr(start+1,end-start-1));//orange,apple,pear

我们首先得到从句首开始的第一个’:‘,然后再从这个位置开始找接下来的第一个’.',就能够得到我们想要的这个字符串
然后通过substring方法或者是substr方法,substr方法将要被官方去除了,所以不建议使用

substring接收两个参数,第一个是我们需要截取字符串开始的地方,第二个就是截取结束的地方
substr也是接收两个参数,第一个是开始截取的位置,第二个是我们需要截取的长度

如果我们需要将上面得到的字符串’orange,apple,pear’再转化为数组的话就可以这样做:

var fruits = ('orange,apple,pear').split(',')//[ 'orange', 'apple', 'pear' ]

检查一个存在的,非空的字符串

如果给定一个变量a,让你来对该变量是否是字符串并且非空进行判断,应该怎么样

从前我们会使用这样的方法

if(typeof a == 'string'&&a.length!=0){
    return true
}else{
    return false
}

看起来这样的方法没有什么问题,但是坑已经在里面了,我们先来了解一下typeof方法

  • 如果变量是一个数字,返回“number”
  • 如果变量是一个字符串,返回“string”
  • 如果变量是一个布尔类型,返回“boolean”
  • 如果变量是一个函数,返回“function”
  • 如果变量未定义,返回“undefined”
  • 如果变量是null,或者是一个数组,或者是其他的javascript对象,则返回“object”

看起来我们的处理方式没有问题,a是字符串类型的应当返回string,我们来看接下来这段代码

let a = 'a'
let b = new String('b')
console.log(typeof a)
console.log(typeof b)

这段很简单的代码我们可以发现a是通过直接赋值的方法声明了一个字符串,b是通过new一个新的String对象得到的一个字符串,所以我们控制台输出的结果将是

string
object

这显然不是我们想要的结果,所以需要在typeof b后面加一个indexOf()在进行打印得到的就是

string

如此看来我们将上面的方法改为下面的形式,好像就可以了

if(typeof a.valueOf() == 'string'&&a.length!=0){
    return true
}else{
    return false
}

坑又来了
我们没有意识到一点,就是a可能是未定义,如果a是未定义的话 可能我们会想 typeof undefined 得到的是undefined呀,是!=string的,但是我们忽略了一点

undefined.valueOf()返回的不是false而是会直接报错

所以我们应该这样写

if(typeof a != 'undefined' && typeof a.valueOf()=='string'&&a.length>0){
    return true
}else{
    return false
}

分割字符串形成数组

a.spilt()方法可以将字符串分割成数组
spilt接收两个参数,其中第一个参数我们是经常使用的,用来传入一个字符串或者是正则,作为分隔符,而这个参数是必须的,第二个参数是分割为几个元素

let a = 'orange,apple,pear,strawberry'
console.log(a.split(','))
console.log(a.spilt(',',2))

首先第一个返回的是[‘orange’,‘apple’,‘pear’,‘strawberry’]这个是毋庸置疑的,但是第二个将返回什么呢,是将字符串分为了两部分,还是将我们上面得到的那个数组的前两个元素呢?
我们运行后得到

[‘orange’,‘apple’]

很显然我们就可以得知了,split()是先将字符串进行切割,然后再根据第二个参数的数值进行取值的,数值为多大,我们就取几个值,但是如果第二个参数超过了本来的数组长度怎么办?

let a = 'orange,apple,pear,strawberry'
    console.log(a.split(',',6).length);
    console.log(a.split(',',6)

运行上面的方法我们可以得到

4
[ ‘orange’, ‘apple’, ‘pear’, ‘strawberry’ ]

所以当我们传入的第二个参数的数值溢出了,也不会返回一个过长的数组,而是依然返回能够返回的一个最大的数组

第一个参数我们是可以穿空字符串的,那样我们就将得到一个将字符串中所有字符集,包括空格也会成为数组的元素之一

插入特殊符号

在一个字符串中添加’'字符

我们都知道在声明一个字符串时,需要把字符串使用‘’或者是“”包裹起来,所以当我们想要在字符串中添加一个特殊字符时我们可以采用这样的方式

const a = "'hello'"
const b = `${"'"}hello${"'"}`
const c = '\'hello\''
console.log(a)
console.log(b)
console.log(c)

控制台输出内容为

‘hello’
‘hello’
‘hello’

我们使用的方式第一种是使用“”进行包裹‘’,第二种是使用模版字符串语法但也是使用双引号包裹单引号的方法,而第三种我们使用的是转义序列的方法

我们先来了解一下转义序列

  • ’ 单引号
  • " 双引号
  • \ 反斜杠
  • \b 退格
  • \f 换页符
  • \n 换行
  • \r 回车
  • \t 水平制表符
  • \ddd 八进制序列
  • \xdd 十六进制序列
  • \uddddd unicode序列
    最后的这个三个序列是模式,通过提供不同的数字值,导致不同的转义序列

比如我们要实现©️这个符号,就可以使用unicode序列\u0009实现

你可能感兴趣的