JS中 String/JSON 方法总结

阅读量：5046 次

发布时间：2019-06-12

本文共 4886 字，大约阅读时间需要 16 分钟。

前言

Javascript虽是一种动态类型、弱类型、基于原型的语言, 但功能强大, 可以实现各种各样的对数据操作, 这些操作其实也是万变不离其宗, 都是由简单的API一步步实现的。

前言是我随便乱码的, 哈哈哈。

by the way, Sting Array JSON 都是JS的内置对象, 其中, JSON是Ecma262-5标准中增加的。

此为 Sring篇。

String

打开浏览器控制台, 输入 String:

也就是说, 这部分是由浏览器内的JS引擎实现的, 但与今天无关, 不多赘述。

如果需要查看的是内置对象 String的方法呢?? easy, 控制台走起:

返回了一长串, 这些就是在String内置的方法, 当然, __proto__指向Object, 这是必然。

在这里, 当然会挑选常用的来说。

常用的字符串操作方法(增删改查)

长度和索引

字符串长度 length

可以直接使用 .length 属性来获取字符串长度

var lyric = 'Yeah I think about the end just way too much'console.log(lyric.length)

字符串索引

下标

字符串是字符的有序排列, 那就当然可以通过字符串的下标对其字符进行检索

var lyric = 'Yeah I think about the end just way too much'  for(let i=0; i

PS: 以上遍历内用了ES6的字符串模板内容。

..........................

charAt()

charAt()传入的参数也是下标index值, 该字符串为空, 则返回值为 '空'

var lyric = 'Yeah I think about the end just way too much'  console.log('lyric.charAt(7):' + lyric.charAt(7))  console.log('lyric.charAt(4):' + lyric.charAt(4))  console.log('lyric.charAt(100):' + lyric.charAt(100))  var description = ''  console.log('description.charAt(5):' + description.charAt(5))

可见, 无论是空格还是空字符, 返回的都是 '空'

PS: 另还有charCodeAt(), 返回的是传入index对应字符返回ASCII码, 可以区分到底是空格还是 '空'。

字符串的截取

String的API中, 截取算是对字符串最基本的操作, 其中用来截取字符串的方法有:

substr / substring / slice

substr()

可以传入的是两个参数, 第一个是截取开始位置, 第二个是截取的长度

var lyric = 'Yeah I think about the end just way too much'  console.log('lyric.substr(2, 10):' + lyric.substr(2, 10))  var description = ''  console.log('description.substr(2, 10):' + description.substr(2, 10))

空的字符串, 返回的也会是个 '空'

substring()

也是传入两个参数, 第一个是起始位置, 第二个参数和substr不同, 是结束位置, 但该结束位置不包括在内。

var lyric = 'Yeah I think about the end just way too much'  console.log('lyric.substring(12, 20):' + lyric.substr(12, 20))  console.log('lyric.substring[12]:' + lyric[12])  console.log('lyric.substring[20]:' + lyric[20])  var description = ''  console.log('description.substring(12, 20):' + description.substr(12, 20))

slice()

slice与substing类似, 也是起始位置和结束位置, 但不同的是, slice是可以接受负参数的, 负参数表示倒数位置。

var lyric = 'Yeah I think about the end just way too much'  console.log('lyric.slice(12, 20):' + lyric.slice(12, 20))  console.log('lyric[12]:' + lyric[12])  console.log('lyric[20]:' + lyric[20])  console.log('lyric.slice(20, -2):' + lyric.slice(20, -2))  var description = ''  console.log('description.slice(12, 20):' + description.slice(12, 20))

另外slice还有一种用法, 就是创建当前数组的副本, 直白点, 就是copy。

使用方法就是不加任何参数, 如: lyric.slice()

该操作非常适合不能直接改变原字符串而又要使用原字符串内容进行操作的情境, 如: vuex

字符串的查找和替换

查找

在String中, 常用的查找有三种: search / match / indexOf

替换有一种: replace

嗯, 其实也就是它们本身的英文含义。

search()

search, 经常见的词, 查找嘛 .....

search()中能接收一个参数, 就是你需要查找的字符,

如果有, 返回在字符串中的下标index,

如果没有, 返回 -1

var lyric = 'Yeah I think about the end just way too much'  console.log("lyric.search('a'):" + lyric.search('a'))  console.log("lyric.search('y'):" + lyric.search('y'))  console.log("lyric.search('z'):" + lyric.search('z'))   console.log("lyric.search('end'):" + lyric.search('end'))  var description = ''  console.log("description.search('a'):" + description.search('a'))

从运行结果可以看出, 返回的都是第一次出现该字符的下标index。

match()

一般是搭配正则使用的, 参数也就是匹配的正则或者字符。

正则学的比较烂, 只会复制粘贴现有的来用, 就不秀操作了。

indexOf()

indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。

stringObject.indexOf(searchvalue,fromindex)

返回 searchvalue 的第一次出现的位置, 且对大小写敏感。

也有一个查找最后一个字符的方法, lastindexOf(), 使用同理。

var lyric = 'Yeah I think about the end just way too much'  console.log(lyric.indexOf('end'))  console.log(lyric.indexOf('I'))  console.log(lyric.indexOf('i'))  console.log(lyric.indexOf('f-word'))

可见, 字符串中空格也是算一个字符的。

替换

replace()

用于查找并替换该字符, 执行后会返回一个新的字符串, 对原字符串并没有影响。

可以接收两个参数, 第一个为被查找并替换的字符, 第二个为用来替换原字符的新字符。

var lyric = 'Yeah I think about the end just way too much'  var a = lyric.replace('the end', 'THEEND')  console.log("lyric.replace('the end', 'THEEND'):" + lyric.replace('the end', 'THEEND'))  console.log(a)  console.log(lyric)

字符串的其它常规操作

toUpperCase()

toLowerCase()

大小写的转换

concat()

concat() 方法用于连接两个或多个字符串。

stringObject.concat(stringX,stringX,...,stringX)

// 拼接是没有空格的  var h = 'hello '  var w = 'world'  var hw = h.concat(w)  console.log(hw)  console.log(h)  console.log(w)  // 如果数量少的话 还是使用 '' + '' 吧

返回一个新的字符串, 见控制台:

split()

用来把字符串转化成数组, 这样就可以对字符串进行更复杂的操作。

逆方法为 join(), 把数组转化成字符串。

可以传入一个参数, 就是用来作为分割的参照物。

关于这个参数, 那可就是各种各样的玩的飞起了, 一个个看:

var lyric = 'Yeah I think about the end just way too much'  // 不传参数  var arr1 = lyric.split()  console.log('不传参数:')  console.log(arr1)  // 以 空'' 为参数  var arr2 = lyric.split('')  console.log('以空为参数:')  console.log(arr2)  // 以空格为参数  var arr3 = lyric.split(' ')  console.log('以空格为参数:')  console.log(arr3)  // 以字符为参数  var arr4 = lyric.split('a')  console.log("以字符'a'为参数:")  console.log(arr4)  console.log('执行后的原字符串:')  console.log(lyric)

为了最终结果不产生隐式转换(即一部分是字符串, 另一部分是数组, 最后输出的则为字符串), 所以选择了分开console.log。

这就是隐式转换, 最简单的, 如: ' ' + 2017 = '2017', 根本就用不上什么toString()。