JavaScript-String对象 (读书笔记)


学习前先放上第一篇写的文章,这篇再次学习数组我们来讲一下上次没讲到的JS数组、字符串、数学函数

小总结
length-长度属性
charAt(idx)-返回制定位置字符串
charCodeAt(idx)-返回unicode码
concat()-连接字符串
slice()-提取字符串
substring()-提取字符串,会转化负数为0或调换参数位置
substr(idx, num)- 提取字符串,第二个参数为个数
indexOf(), lastIndexOf() - 确定字符串的位置
trim() - 去空符号
toLowerCase(), toUpperCase() -转化大小写
localeCompare() - 比较字符串
match() - 匹配字符串,返回数组并带有index、input属性 - 接受正则
search() - 与match类似 - 接受正则
replace() - 替换字符串 - 接受正则
split() - 按规则分割为数组

String对象的属性和方法

length属性

length属性返回字符串的长度

'hello'.length //5

charAt()

charAt方法返回指定位置的字符串

var str = 'hello'
str.charAt(1) //'e'
str.charAt(str.length - 1) //'o'

可以用数组下标替代

'hello'.charAt(1) //'e'
'hello'[1] //'e'

如果参数为负数,或大于等于字符串的长度,charAt返回空字符串

'abc'.charAt(-1) // ""
'abc'.charAt(3) // ""

charCodeAt()

charCodeAt方法返回给定位置字符的Unicode码点(十进制表示),相当于String.fromCharCode()的逆操作。

'b'.charCodeAt() // 98
String.fromCharCode(98) // b

如果不给下标直接返回当前字符串的第一位,如果给下标返回字符串对应位置字符的Unicode编码

'abc'.charCodeAt() // 97
'abc'.charCodeAt(1) // 98

charCodeAt方法返回的Unicode码不得大于65536(0xFFFF)

concat()

concat方法用于连接两个字符换,不改变原字符串

var str1 = 'a'
var str2 = 'b'
str1.concat(str2) // 'ab'

该方法可以接受多个参数

'a'.concat('b','c') // 'abc'

如果参数不是字符串,cancat方法会把参数转化为字符串再连接

'a'.concat(1,2) //'a12' 这里数字1 2是number对象

slice()

slice方法用于提取字符串,不改变原字符串,slice(开始位置,结束位置)

'hello world'.slice(0, 2) // 'he'

如果只传一个参数,则返回此参数位置后的所有字符

'hello world'.slice(2) // "llo world"

如果参数是负数,负值表示从倒数位置开始

'hello world'.slice(0, -5) // "hello "
'hello world'.slice(0, -7) // "hell"
'hello world'.slice(2, -7) // "ll"

如果第一个参数(开始位置)大于第二个参数(结束位置) 返回空字符

'hello world'.slice(4,0) // ""

substring()

substring方法与slice相似,但是有些区别:
如果第二个参数大于第一个参数,substring方法会自动更换两个参数的位置

'hello world'.substring(0, 4) // "hell"
'hello world'.substring(4, 0) // "hell"

如果参数为负数,则转化为0

'hello world'.substring(-3) // "hello world"
'hello world'.substring(3,-3) //"hel"  这里参数可以看做(3,0) ,然后substring方法更换了参数位置为(0,3)

substr()

substr方法也用于取出字符串,不过第一个参数表示开始位置,第二个参数表示取出的长度

'hello world'.substr(3, 3) // "lo "

如果只有一个参数,表示直接取到字符串结尾

'hello world'.substr(3) // "lo world"

如果第一个参数是负数,表示倒数的字符位置。如果第二个参数是负数,则转为0,取0个,返回空字符

'hello world'.substr(-3)  // "rld"
'hello world'.substr(3,-3) // ''

indexOf(), lastIndexOf()

这个两个方法用于确定一个字符串再另一个字符串中的文职,都返回一个整数,表示匹配开始的位置。不匹配则返回0,indexOf从头匹配,lastIndexOf从尾部匹配

'hello world'.indexOf('o') // 4
'hello world'.indexOf('wor') // 6
'hello world'.lastIndexOf('o') // 7

这两个方法还接受第二个参数(整数),表示从该位置开始匹配第一个参数的字符串

'hello world'.indexOf('o', 6) // 7
'hello world'.lastIndexOf('o', 6) // 4

trim()

trim方法表示取出字符串首尾的空格,返回新字符串

'  hello world  '.trim() // 'hello world'

该方法去除的不仅是空格,还包括制表符(\t、\v)、换行符(\n)和回车符(\r)。

'\r\nabc \t'.trim() // 'abc'

toLowerCase(), toUpperCase()

toLowerCaser转换为小写,toUpperCaser转换为大写,返回新字符串

'Hello World'.toLowerCase()// "hello world"
'Hello World'.toUpperCase()// "HELLO WORLD"

这个方法也可以将布尔值和数组转换为大小写,但是要用call使用

String.prototype.toUpperCase.call(true) //'TRUE'
String.prototype.toLowCase.call(['A', 'B']) //'a, b' 
//都被转换为字符串

localeCompare()

localeCompare方法用于比较两个字符串。str1 < str2 返回 -1,str1 > str2 返回1, str1 == str2 返回0, 比较是根据字符的unicode码来比较的,字母的大小写unicode码是不一样的

'a'.localeCompare('ba') // -1
'a'.localeCompare('a') // 0
'b'.localeCompare('a') // 1

match()

match方法用于确定原字符串是否匹配某个字符,返回数组,返回的值为匹配的第一个字符串,如果无匹配到则返回null

'ca, ba, cda'.match('a') // ['a']
'cat, bat, sat, fat'.match('at') // ["at"]
'ca, ba, cda'.match('e') // null

返回的数组具有index属性和input属性,分别表示匹配字符串开始的位置和原始字符串

var match = 'ak, ek, akb, ake'.match('ak')
match.index // 0 匹配的位置是从0开始的
match.input  //  'ak, ek, akb, ake' 原始字符串

search()

search方法与match相似,返回的是匹配的第一个位置,如果没有匹配到返回-1,此方法类似搜索与否

'cat, bat, sat, fat'.search('at') //1
'cat, bat, sat, fat'.search('ba') //5
'cat, bat, sat, fat'.search('d') //-1

replace()

replace方法用于替换匹配的字符串,一般只替换第一个匹配,配合正则的全局g可以替换所有字符

'aaa'.replace('a', 'b') // "baa"
'aaa'.replace(/a/g, 'b') // "bbb"

split()

split方法安装给定的规则分割字符串为数组

'a|b|c'.split('|') // ["a", "b", "c"]
'a|b|c'.split('') // ["a", "|", "b", "|", "c"]

如果不加参数则返回一个具有原字符串的数组

'a|b|c'.split() // ["a|b|c"]

如果满足分割规则的两个部分中间没其他字符,则返回数组之中会出现空字符串

'a||c'.split('|') // ['a', '', 'c']

如果满足分割规则的部分处于字符串的开头或结尾,则返回数组的第一个或最后一个位置的空字符串

'|b|c'.split('|') // ["", "b", "c"]
'a|b|'.split('|') // ["a", "b", ""]

此方法接受第二个参数,限定返回数组的最大长度

'a|b|c'.split('|', 0) // []
'a|b|c'.split('|', 1) // ["a"]
'a|b|c'.split('|', 2) // ["a", "b"]
'a|b|c'.split('|', 3) // ["a", "b", "c"]
'a|b|c'.split('|', 4) // ["a", "b", "c"]

参考

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

推荐阅读更多精彩内容

  • 第5章 引用类型(返回首页) 本章内容 使用对象 创建并操作数组 理解基本的JavaScript类型 使用基本类型...
    大学一百阅读 3,204评论 0 4
  • 3. 标准库 3.1Object对象 3.1.1概述 js提供一个Object对象,所有其他对象都继承自它。Obj...
    暗夜的怒吼阅读 581评论 0 3
  • 参考基础教程的整理,方便记忆 一、Object对象 (O大写) 所有其他对象都继承自这个对象。Object本身也是...
    Viaphlyn阅读 2,300评论 0 0
  • 这几天占据各大新闻网站头条的始终是白百合的出轨事件,随着白百合与小鲜肉的“一指禅”、“摸臀杀”剧情深入,陈羽...
    公子小霖阅读 1,261评论 1 2
  • 选项卡是现代web网页中最常用的效果之一。本文重点是用angularjs这个非常火mvvm框架,实现选项卡效果。在...
    超人不会飞jjw阅读 1,116评论 0 6