通过实例深入的了解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,这三个值分别代表了a<b,a=b,a>b

很多人觉得这种方法不是很实用,但是这种方法可以让我们直接分辨出两个字符串的关系,但是这种方法仅适用于两个字符串进行比较,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实现

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 205,236评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,867评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,715评论 0 340
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,899评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,895评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,733评论 1 283
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,085评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,722评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,025评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,696评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,816评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,447评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,057评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,009评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,254评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,204评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,561评论 2 343

推荐阅读更多精彩内容