您现在的位置是：网站首页> 编程资料编程资料

梳理总结JavaScript的23个String方法_javascript技巧_

2023-05-24 378人已围观

简介梳理总结JavaScript的23个String方法_javascript技巧_

简单介绍

JavaScript 中的String类型用于表示文本型的数据。它是由无符号整数值（16bit）作为元素而组成的集合。字符串中的每个元素在字符串中占据一个位置. 第一个元素的 index 值是 0，下一个元素的 index 值是 1，以此类推。字符串的长度就是字符串中所含的元素个数.你可以通过 String 字面值或者 String 对象两种方式创建一个字符串。

1、charAt()

字符串中的字符从左向右索引，第一个字符的索引值为 0，最后一个字符（假设该字符位于字符串 stringName 中）的索引值为 stringName.length - 1。如果指定的 index 值超出了该范围，则返回一个空字符串

var anyString = "Brave new world"; console.log("The character at index 0 is '" + anyString.charAt(0) + "'"); console.log("The character at index 1 is '" + anyString.charAt(1) + "'"); console.log("The character at index 2 is '" + anyString.charAt(2) + "'"); console.log("The character at index 3 is '" + anyString.charAt(3) + "'"); console.log("The character at index 4 is '" + anyString.charAt(4) + "'"); console.log("The character at index 999 is '" + anyString.charAt(999) + "'");

输出：

The character at index 0 is 'B'
The character at index 1 is 'r'
The character at index 2 is 'a'
The character at index 3 is 'v'
The character at index 4 is 'e'
The character at index 999 is ''

2、charCodeAt()

返回 0 到 65535 之间的整数，表示给定索引处的 UTF-16 代码单元

"ABC".charCodeAt(0) // returns 65:"A" "ABC".charCodeAt(1) // returns 66:"B" "ABC".charCodeAt(2) // returns 67:"C" "ABC".charCodeAt(3) // returns NaN

3、codePointAt()

如果在指定的位置没有元素则返回undefined。如果在索引处开始没有 UTF-16 代理对，将直接返回在那个索引处的编码单元。

'ABC'.codePointAt(1); // 66 '\uD800\uDC00'.codePointAt(0); // 65536 'XYZ'.codePointAt(42); // undefined

4、indexOf()

返回调用它的String对象中第一次出现的指定值的索引，从 fromIndex 处进行搜索。如果未找到该值，则返回 -1

const paragraph = 'The quick brown fox jumps over the lazy dog. If the dog barked, was it really lazy?'; const searchTerm = 'dog'; const indexOfFirst = paragraph.indexOf(searchTerm); console.log(`The index of the first "${searchTerm}" from the beginning is ${indexOfFirst}`); // expected output: "The index of the first "dog" from the beginning is 40" console.log(`The index of the 2nd "${searchTerm}" is ${paragraph.indexOf(searchTerm, (indexOfFirst + 1))}`); // expected output: "The index of the 2nd "dog" is 52"

5、lastIndexOf()

返回调用String对象的指定值最后一次出现的索引，在一个字符串中的指定位置 fromIndex处从后向前搜索。如果没找到这个特定值则返回-1

'canal'.lastIndexOf('a'); // returns 3（没有指明 fromIndex 则从末尾 l 处开始反向检索到的第一个 a 出现在 l 的后面，即 index 为 3 的位置） 'canal'.lastIndexOf('a', 2); // returns 1（指明 fromIndex 为 2 则从 n 处反向向回检索到其后面就是 a，即 index 为 1 的位置） 'canal'.lastIndexOf('a', 0); // returns -1(指明 fromIndex 为 0 则从 c 处向左回向检索 a 发现没有，故返回-1) 'canal'.lastIndexOf('x'); // returns -1 'canal'.lastIndexOf('c', -5); // returns 0（指明 fromIndex 为-5 则视同 0，从 c 处向左回向查找发现自己就是，故返回 0） 'canal'.lastIndexOf('c', 0); // returns 0（指明 fromIndex 为 0 则从 c 处向左回向查找 c 发现自己就是，故返回自己的索引 0） 'canal'.lastIndexOf(''); // returns 5 'canal'.lastIndexOf('', 2); // returns 2

6、startsWith()

用来判断当前字符串是否以另外一个给定的子字符串开头，并根据判断结果返回 true 或 false

const str1 = 'Saturday night plans'; console.log(str1.startsWith('Sat')); // expected output: true console.log(str1.startsWith('Sat', 3)); // expected output: false

7、endsWith()

用来判断当前字符串是否是以另外一个给定的子字符串“结尾”的，根据判断结果返回 true 或 false

var str = "To be, or not to be, that is the question."; alert( str.endsWith("question.") ); // true alert( str.endsWith("to be") ); // false alert( str.endsWith("to be", 19) ); // true

8、includes()

用于判断一个字符串是否包含在另一个字符串中，根据情况返回 true 或 false

var str = 'To be, or not to be, that is the question.'; console.log(str.includes('To be')); // true console.log(str.includes('question')); // true console.log(str.includes('nonexistent')); // false console.log(str.includes('To be', 1)); // false console.log(str.includes('TO BE')); // false

总结一下：

上面介绍的8个方法，大致分为三类：

字符串指定位置的字符或者字符编码:charAt, charCodeAt, codePointAt
返回字符串中指定子串的位置或最后位置:indexOf, lastIndexOf
字符串是否以指定字符串开始、结束或包含指定字符串:startsWith, endsWith, includes

9、concat()

将一个或多个字符串与原字符串连接合并，形成一个新的字符串并返回。

let hello = 'Hello, ' console.log(hello.concat('Kevin', '. Have a nice day.')) // Hello, Kevin. Have a nice day. let greetList = ['Hello', ' ', 'Venkat', '!'] "".concat(...greetList) // "Hello Venkat!" "".concat({}) // [object Object] "".concat([]) // "" "".concat(null) // "null" "".concat(true) // "true" "".concat(4, 5) // "45"

10、fromCharCode()

静态 String.fromCharCode() 方法返回由指定的 UTF-16 代码单元序列创建的字符串。

String.fromCharCode(65, 66, 67); // 返回 "ABC" String.fromCharCode(0x2014); // 返回 "—" String.fromCharCode(0x12014); // 也是返回 "—"; 数字 1 被剔除并忽略 String.fromCharCode(8212); // 也是返回 "—"; 8212 是 0x2014 的十进制表示

11、fromCodePoint()

String.fromCodePoint() 静态方法返回使用指定的代码点序列创建的字符串。

String.fromCodePoint(42); // "*" String.fromCodePoint(65, 90); // "AZ" String.fromCodePoint(0x404); // "\u0404" String.fromCodePoint(0x2F804); // "\uD87E\uDC04" String.fromCodePoint(194564); // "\uD87E\uDC04" String.fromCodePoint(0x1D306, 0x61, 0x1D307) // "\uD834\uDF06a\uD834\uDF07" String.fromCodePoint('_'); // RangeError String.fromCodePoint(Infinity); // RangeError String.fromCodePoint(-1); // RangeError String.fromCodePoint(3.14); // RangeError String.fromCodePoint(3e-2); // RangeError String.fromCodePoint(NaN); // RangeError

12、split()

使用指定的分隔符字符串将一个String对象分割成子字符串数组，以一个指定的分割字串来决定每个拆分的位置。

const str = 'The quick brown fox jumps over the lazy dog.'; const words = str.split(' '); console.log(words[3]); // expected output: "fox" const chars = str.split(''); console.log(chars[8]); // expected output: "k" const strCopy = str.split(); console.log(strCopy); // expected output: Array ["The quick brown fox jumps over the lazy dog."]

13、slice()

提取某个字符串的一部分，并返回一个新的字符串，且不会改动原字符串

const str = 'The quick brown fox jumps over the lazy dog.'; console.log(str.slice(31)); // expected output: "the lazy dog." console.log(str.slice(4, 19)); // expected output: "quick brown fox" console.log(str.slice(-4)); // expected output: "dog." console.log(str.slice(-9, -5)); // expected output: "lazy"

14、substring()

返回一个字符串在开始索引到结束索引之间的一个子集，或从开始索引直到字符串的末尾的一个子集。

var anyString = "Mozilla"; // 输出 "Moz" console.log(anyString.substring(0,3)); console.log(anyString.substring(3,0)); console.log(anyString.substring(3,-3)); console.log(anyString.substring(3,NaN)); console.log(anyString.substring(-2,3)); console.log(anyString.substring(NaN,3)); // 输出 "lla" console.log(anyString.substring(4,7)); console.log(anyString.substring(7,4)); // 输出 "" console.log(anyString.substring(4,4)); // 输出 "Mozill" console.log(anyString.substring(0,6)); // 输出 "Mozilla" console.log(anyString.substring(0,7)); console.log(anyString.substring(0,10));

15、substr()

返回一个字符串中从指定位置开始到指定字符数的字符(注意：该方法可能会被废弃，使用substring代替)

提示： 本文由神整理自网络，如有侵权请联系本站删除！
本站声明：
1、本站所有资源均来源于互联网，不保证100%完整、不提供任何技术支持；
2、本站所发布的文章以及附件仅限用于学习和研究目的;不得将用于商业或者非法用途；否则由此产生的法律后果，本站概不负责！

上一篇：Vue实现文件批量打包压缩下载_vue.js_

下一篇：vue实现多级侧边栏的封装_vue.js_