资讯专栏INFORMATION COLUMN

[JS专题1]----字符串

voidking / 1914人阅读

摘要:总结整理与字符串相关的知识点。第二个参数,表示开始搜索的位置返回布尔值,表示参数字符串是否在原字符串的头部。能识别位字符。

总结:整理与字符串相关的知识点。
主要有
1.对字符串的查找,如是否有某些字符,字符在哪个位置,根据位置去查找字符
2.对字符串的删除,截取我们想要的字符,也可能是删除我们不想要的字符
3.对字符串的增加 固定格式的补全 自动补全 重复补全 拼接
4.对字符串的替换,对某些字符的全部替换 或者说仅对第一个出现的字符替换
5.转换 大小写的转换 转为码点 码点转字符
6.不同类型的转换;数字与字符串的转换 数组与字符串的转换
7.比较 比较大小 比较某些字符出现的位置顺序

0、字符串的方法大合集
含义 方法 返回值 改变原字符串
查找 indexOf() 位置 no
查找 search() 位置 yes
查找 includes() boolean no
查找 startswith()头部有? boolean yes
查找 endsWith() 尾部有? boolean yes
截取 substr(start,length) 新字符串 no
截取 substring(start,stop) 新字符串 no
截取 slice(start,stop) 新字符串 no
去空格 trim() ** no
重复次数 repeat(n) 新字符串 no
补全 padStart(length,value) 头部补全 新字符串 no
补全 padEnd(length,value)尾部补全 新字符串 no
匹配 match() 查找项+位置 no
正则的全匹配 matchAll() 正则 yes
替换 replace() 新字符串 no
转小写 toUpperCase() 新字符串 yes
转小写 toLowerCase() 新字符串 yes
转码点 charCodeAt() 新字符 no
转码点 codePointAt() 位置 no
转字符 charAt() 新字符 no
转字符 at() 还未实现 位置 no
码点->字符 String.fromCodePoint() 新字符 /
比较位置顺序 localeCompare(a,b) 1/-1/0 no
** normalize() ** no

1.字符串的查找

如是否有某些字符,某个字符的位置是哪里? 第n 位的字符是什么

1.1 根据位置查找

charAt(n) -----返回字符;只接收位置参数,位置参数过大时,返回空。参数非数字时,返回第一个字符

可通过str[n]的方式 -----返回字符---位置参数过大时,返回undefined

charCodeAt(n) -----返回码点,es5

codePointAt(n)-----返回码点,es6 ,优势,能识别大于oxFFFF的编码

var s = "kljlk;juoi"
s.charAt(2) // j
s.charAt("j") // k
s.charAt("15") // ""
s[15] // undefined
s[3] // l
s.charCodeAt(2) //  106
s.codePointAt(2) // 106
1.2 是否有某些字符,根据字符查找
- indexOf()-------返回位置,没有就返回-1
- lastIndexOf();---返回位置,从后开始查找
- includes():返回布尔值,表示是否找到了参数字符串。第二个参数,表示开始搜索的位置
- startsWith():返回布尔值,表示参数字符串是否在原字符串的头部。第二个参数,表示开始搜索的位置
- endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部第二个参数,表示开始搜索的位置 
- match()---返回相关的信息--只接受一个参数,要么正则表达式 要么RegExp对象
- search()----返回位置,没有就返回-1---只接受一个参数,要么正则表达式 要么RegExp对象
let s = "Hello world!";

s.startsWith("world", 6) // true
s.endsWith("Hello", 5) // true
s.includes("Hello", 6) // false

var s1 = "fdkfdkjldrm "
s1.indexOf("kjl") // 5
s1.lastIndexOf("kjl") // 5
s1.indexOf("fd") // 0
s1.lastIndexOf("fd") // 3
s1.search("fdlp") // -1
s1.search("fd") // 0
s1.search("kjl") // 5
s1.match("fd") // ["fd", index: 0, input: "fdkfdkjldrm ", groups: undefined]
s1.match("f5") // null
2.字符串的增删改

以下4种方法不会修改字符串本身;

2.1 删除

2.1.2截取
slice(start,stop)
substring(start,stop)
substr(start,length)

  **共同点:**
  基于字符串创建新字符串,不改变原有字符串
  第二个参数是可选的
  无第二个参数,即字符结尾为结束位置
  **不同点**
  对负数的处理:
  slice()---将负数和字符串长度相加
  substring()----将负数转为0
  substr()---将第一个负数和字符串长度相加。第二个负数转为0,即不截取


2.1.2 删除空格

    trim() 删除字符串中 前置和后置的空格
    

2.2 增加 2.2.1 复制n遍字符串

repeat(n) --返回一个新字符串,表示将原字符串重复n次。
参数如果是小数,会被取整

"x".repeat(3) // "xxx"
"hello".repeat(2) // "hellohello"
"na".repeat(0) // ""
"na".repeat(2.9) // "nana"
"na".repeat(Infinity)
// RangeError
"na".repeat(-1)
// RangeError
参数NaN等同于 0
2.2.2.补全长度

padStart(minlength,string)用于头部补全,
padEnd(minlength,string)用于尾部补全
用途:

提示字符串格式;

为数值补全指定位数

"x".padStart(5, "ab") // "ababx"
"x".padStart(4, "ab") // "abax"
"x".padEnd(5, "ab") // "xabab"
"x".padEnd(4, "ab") // "xaba"
"xxx".padStart(2, "ab") // "xxx"
"xxx".padEnd(2, "ab") // "xxx"
"x".padStart(4) // "   x"
"x".padEnd(4) // "x   "
"12".padStart(10, "YYYY-MM-DD") // "YYYY-MM-12"
"09-12".padStart(10, "YYYY-MM-DD") // "YYYY-09-12"
2.3 - 拼接 concat();

2.4 修改

replace();

3.字符串的转换 3.1 大小写的转换
- toLowerCase();-----小写
- toUpperCase();----变大写
- toLocaleLowerCase();
- toLocaleUpperCase();
3.2 码点 --> 字符

根据码点返回对应的字符

es5:String.fromCharCode(0x20BB7); 定义在String对象上

es6:String.fromCodePoint();定义在字符串的实例对象上。--能识别32位字符。即能识别Unicode编号大于oxFFFF;

String.fromCharCode(100)
"d"
String.fromCodePoint(0x20BB7)
// "?"
String.fromCodePoint(100,100,100)
// ffffd
4.不同类型的转换 4.1 string 与 array

array.join(",") ------将数组转字符串
string.split(",") ---------字符串转数组

4.2 number与string

number --->string(4种)

1.Number()
2.parseInt()
3.parseFloat()
4.+string-----
var s = "23"
var k = +s
typeof k // number

number---> string(4种)

String(number)--强制转换
toString(8进制)
toFixed(n)---//数字转换为字符串,并且显示小数点后的指定的位数
number + ""
var s = 123.68
var k= s.tiString(8)
var k0 = s.toFixed(1)
var k1 = String(s)
k // "173.43656"
k0 // "123.7"
k1 // "123.68"
4.3 string 与 object

JSON.parse() ------ json 字符串 转 json 对象
JSON.stringify() -----json 对象转 json 字符串

5 .字符串的比较

localeCompare()---比较2个字符串,参数应该在比较的字符串前面,则返回1;后面,则 -1; 等于,则 0;

var s= "dfhk"
s.localeCompare("fgfg") // -1
s.localeCompare("afgfg") // 1
s.localeCompare("dfhk") // 0
s.localeCompare("df") // 1
6.其他常用的方法 6.1字符串的遍历器接口

字符串可以被for...of循环遍历。

与es5的比较
for循环虽可以遍历字符串,但不能识别大于oxFFFF的编码;

valueOf()

toLocaleString()

7.{{BANNED}}考题

1.

function showCase(value) {
    switch(value) {
    case "A":
        console.log("Case A");
        break;
    case "B":
        console.log("Case B");
        break;
    case undefined:
        console.log("undefined");
        break;
    default:
        console.log("Do not know!");
    }
}
showCase(new String("A"));
结果是 ‘"Do not know!’

2.

function showCase2(value) {
    switch(value) {
    case "A":
        console.log("Case A");
        break;
    case "B":
        console.log("Case B");
        break;
    case undefined:
        console.log("undefined");
        break;
    default:
        console.log("Do not know!");
    }
}
showCase2(String("A"));

结果是‘Case A’

3.

"5" + 3

"5" - 3

// 53 2; because:Strings know about + and will use it, but they are ignorant of - so in that case the strings get converted to numbers.

4.

3.toString()
3..toString()
3...toString()

// error  "3" error;because:1.1, 1., .1 都是合法的数字. 那么在解析 3.toString 的时候这个 . 到底是属于这个数字还是函数调用呢? 只能是数字, 因为3.合法啊!


文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/107193.html

相关文章

  • JS专题之数组去重

    摘要:将元素作为对象的键,默认键对应的值为如果对象中没有这个键,则将这个元素放入结果数组中去。 前言 数组去重在日常开发中的使用频率还是较高的,也是网上随便一抓一大把的话题,所以,我写这篇文章目的在于归纳和总结,既然很多人都在提的数组去重,自己到底了解多少呢。又或者是如果自己在开发中遇到了去重的需求,自己能想到更好的解决方案吗。 这次我们来理一理怎么做数组去重才能做得最合适,既要考虑兼容性,...

    only_do 评论0 收藏0
  • 专题

    摘要:专题安全攻防专题跨站脚本攻击,原理利用系统漏洞,将具有恶意攻击行为的可执行脚本植入系统,且会自动执行。 专题 /* * web安全攻防专题 * ------------------------------------------------------------------------ * xss:跨站脚本攻击(XSS,Cross-site scripting) * * * 1、...

    Leck1e 评论0 收藏0
  • JS专题之数组展开

    摘要:根据需求的特点,数组展开需要进行迭代和递归。回答文章开头的问题将多重数组转化成单层数组的过程就是数组展开,也叫作数组扁平化一循环加递归最简单的思路循环中判断,如果子元素是数组则递归。 前言 首先什么是数组展开? 假如现在有这样一个需求:将后台的一个多重 List 数据,展开成一个 List 后,并去重后排序; [a, b, [c, d], [[d],e], f] => [a, b, ...

    boredream 评论0 收藏0
  • [面试专题]Vue.js 2.0 独立构建和运行时构建的区别

    摘要:独立构建和运行时构建的区别标签空格分隔未分类在使用时,有独立构建和运行时构建两种版本可供选择。运行时构建不包括模板编译,不支持选项。这就形成了独立构建编译器运行时和运行时构建仅运行时。 Vue.js 2.0 独立构建和运行时构建的区别 标签(空格分隔): 未分类 在使用 Vue.js 2.0 时,有独立构建(standalone)和运行时构建(runtime-only)两种版本可供选...

    李义 评论0 收藏0
  • [面试专题]Vue.js 2.0 独立构建和运行时构建的区别

    摘要:独立构建和运行时构建的区别标签空格分隔未分类在使用时,有独立构建和运行时构建两种版本可供选择。运行时构建不包括模板编译,不支持选项。这就形成了独立构建编译器运行时和运行时构建仅运行时。 Vue.js 2.0 独立构建和运行时构建的区别 标签(空格分隔): 未分类 在使用 Vue.js 2.0 时,有独立构建(standalone)和运行时构建(runtime-only)两种版本可供选...

    svtter 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<