- 1、charAt()方法
- 2、charCodeAt()方法
- 3、concat()方法
- 4、fromCharCode()
- 5、indexOf()
- 6、lastIndexOf()
- 7、localeCompare()
- 8、match()
- 9、replace()
- 10、search()
- 11、slice()方法
- 12、split()方法
- 13、substr()方法
- 14、substring()
- 15、toLocaleLowerCase()
- 16、toLocaleUpperCase()
- 17、toLowerCase()
- 18、toString()
- 19、toUpperCase()
- 20、trim()
- 21、valueOf()
总结一下前端开发常用的字符串方法。
1、charAt()方法
定义和用法
charAt()
方法可返回指定位置的字符。
请注意,JavaScript 并没有一种有别于字符串类型的字符数据类型,所以返回的字符是长度为 1 的字符串。
实例
在字符串 “Hello world!” 中,我们将返回位置 1 的字符:
var str="Hello world!" console.log(str.charAt(1)) //打印结果 e
2、charCodeAt()方法
定义和用法
charCodeAt()
方法可返回指定位置的字符的 Unicode 编码。这个返回值是 0 – 65535 之间的整数。
charCodeAt()
方法与 charAt()
方法执行的操作相似,只不过前者返回的是位于指定位置的字符的编码,而后者返回的是字符子串。
实例
在字符串 “Hello world!” 中,我们将返回位置 1 的字符的 Unicode 编码:
var str="Hello world!" console.log(str.charCodeAt(1)) //打印结果 101
3、concat()方法
定义和用法
concat()
方法用于连接两个或多个数组。
该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。
实例
例子 1:
在本例中,我们将把 concat()
中的参数连接到数组 a 中:
var a = [1,2,3]; console.log(a.concat(4,5)); //输出:1,2,3,4,5
例子 2:
在本例中,我们创建了两个数组,然后使用 concat()
把它们连接起来:
var arr = new Array(3) arr[0] = "张三" arr[1] = "李四" arr[2] = "王五" var arr2 = new Array(3) arr2[0] = "赵六" arr2[1] = "孙七" arr2[2] = "周八" console.log(arr.concat(arr2)) //输出:张三,李四,王五,赵六,孙七,周八
例子 3:
在本例中,我们创建了三个数组,然后使用 concat()
把它们连接起来:
var arr = new Array(3) arr[0] = "张三" arr[1] = "李四" arr[2] = "王五" var arr2 = new Array(3) arr2[0] = "赵六" arr2[1] = "孙七" arr2[2] = "周八" var arr3 = new Array(2) arr3[0] = "吴九" arr3[1] = "郑十" console.log(arr.concat(arr2,arr3)) //输出:张三,李四,王五,赵六,孙七,周八,吴九,郑十
4、fromCharCode()
定义和用法
fromCharCode() 可接受一个指定的 Unicode 值,然后返回一个字符串。
实例
在本例中,我们将根据 Unicode 来输出 “HELLO” 和 “ABC”:
console.log(String.fromCharCode(72,69,76,76,79)) console.log("<br />") console.log(String.fromCharCode(65,66,67)) //以上代码的输出:HELLO ABC
5、indexOf()
定义和用法
indexOf()
方法可返回某个指定的字符串值在字符串中首次出现的位置。
实例
在本例中,我们将在 “Hello world!” 字符串内进行不同的检索:
var str="Hello world!" console.log(str.indexOf("Hello") + "<br />") console.log(str.indexOf("World") + "<br />") console.log(str.indexOf("world"))
以上代码的输出:
0 -1 6
6、lastIndexOf()
定义和用法
lastIndexOf()
方法可返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索。
实例
在本例中,我们将在 “Hello world!” 字符串内进行不同的检索:
var str="Hello world!" console.log(str.lastIndexOf("Hello") + "<br />") console.log(str.lastIndexOf("World") + "<br />") console.log(str.lastIndexOf("world"))
以上代码的输出:
0 -1 6
7、localeCompare()
定义和用法
localeCompare()
方法用本地特定的顺序来比较两个字符串。
实例
在本例中,我们将用本地特定排序规则对字符串数组进行排序:
var str; str.sort (function(a,b){return a.localeCompare(b)})
8、match()
定义和用法
match()
方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。
该方法类似 indexOf()
和 lastIndexOf()
,但是它返回指定的值,而不是字符串的位置。
实例
例子 1:
在本例中,我们将在 “Hello world!” 中进行不同的检索:
var str="Hello world!" console.log(str.match("world") + "<br />") console.log(str.match("World") + "<br />") console.log(str.match("worlld") + "<br />") console.log(str.match("world!"))
以上代码输出:
world null null world!
例子 2:
在本例中,我们将使用全局匹配的正则表达式来检索字符串中的所有数字。
var str="1 plus 2 equal 3" console.log(str.match(/d+/g)) // 1,2,3
9、replace()
定义和用法
replace()
方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
实例
例子 1
在本例中,我们将使用 “mybj123.com” 替换字符串中的 “Microsoft”:
var str="Visit Microsoft!" console.log(str.replace(/Microsoft/, "mybj123.com")) // Visit mybj123.com!
例子 2
在本例中,我们将执行一次全局替换,每当 “Microsoft” 被找到,它就被替换为 “mybj123.com”:
var str="Welcome to Microsoft! " str=str + "We are proud to announce that Microsoft has " str=str + "one of the largest Web Developers sites in the world." console.log(str.replace(/Microsoft/g, "mybj123.com"))
以上代码输出:
Welcome to mybj123.com! We are proud to announce that mybj123.com has one of the largest Web Developers sites in the world.
例子 3
您可以使用本例提供的代码来确保匹配字符串大写字符的正确:
text = "javascript Tutorial"; text.replace(/javascript/i, "JavaScript");
例子 4
在本例中,我们将把 “Doe, John” 转换为 “John Doe” 的形式:
name = "Doe, John"; name.replace(/(w+)s*, s*(w+)/, "$2 $1");
例子 5
在本例中,我们将把所有的花引号替换为直引号:
name = '"a", "b"'; name.replace(/"([^"]*)"/g, "'$1'");
例子 6
在本例中,我们将把字符串中所有单词的首字母都转换为大写:
name = 'aaa bbb ccc'; uw=name.replace(/bw+b/g, function(word){ return word.substring(0,1).toUpperCase()+word.substring(1);} );
10、search()
定义和用法
search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串。
实例
例子 1
在本例中,我们将检索 “mybj123.com”:
var str="Visit mybj123.com!" console.log(str.search(/mybj123.com/)) // 6
在下面的例子中,无法检索到 mybj123.com(因为 search() 对大小写敏感)。
var str="Visit mybj123.com!" console.log(str.search(/Mybj123.com/)) // -1
例子 2
在本例中,我们将执行一次忽略大小写的检索:
var str="Visit mybj123.com!" console.log(str.search(/Mybj123.com/i)) // 6
11、slice()方法
定义和用法
slice()
方法可从已有的数组中返回选定的元素。
实例
例子 1
在本例中,我们将创建一个新数组,然后显示从其中选取的元素:
var arr = new Array(3) arr[0] = "张三" arr[1] = "李四" arr[2] = "王五" console.log(arr + "<br />") console.log(arr.slice(1) + "<br />") console.log(arr) // 张三,李四,王五 // 李四,王五 // 张三,李四,王五
例子 2
在本例中,我们将创建一个新数组,然后显示从其中选取的元素:
var arr = new Array(6) arr[0] = "张三" arr[1] = "李四" arr[2] = "王五" arr[3] = "赵六" arr[4] = "孙七" arr[5] = "周八" console.log(arr + "<br />") console.log(arr.slice(2,4) + "<br />") console.log(arr) // 张三,李四,王五,赵六,孙七,周八 // 王五,赵六 // 张三,李四,王五,赵六,孙七,周八
12、split()方法
定义和用法
split() 方法用于把一个字符串分割成字符串数组。
实例
例子 1
在本例中,我们将按照不同的方式来分割字符串:
var str="How are you doing today?" console.log(str.split(" ") + "<br />") console.log(str.split("") + "<br />") console.log(str.split(" ",3))
输出:
How,are,you,doing,today? H,o,w, ,a,r,e, ,y,o,u, ,d,o,i,n,g, ,t,o,d,a,y,? How,are,you
例子 2
在本例中,我们将分割结构更为复杂的字符串:
"2:3:4:5".split(":") //将返回["2", "3", "4", "5"] "|a|b|c".split("|") //将返回["", "a", "b", "c"]
例子 3
使用下面的代码,可以把句子分割成单词:
var words = sentence.split(' ') // 或者使用正则表达式作为 separator: var words = sentence.split(/s+/)
例子 4
如果您希望把单词分割为字母,或者把字符串分割为字符,可使用下面的代码:
"hello".split("") //可返回 ["h", "e", "l", "l", "o"] // 若只需要返回一部分字符,请使用 howmany 参数: "hello".split("", 3) //可返回 ["h", "e", "l"]
13、substr()方法
定义和用法
substr()
方法可在字符串中抽取从 start 下标开始的指定数目的字符。
实例
例子 1
在本例中,我们将使用 substr()
从字符串中提取一些字符:
var str="Hello world!" console.log(str.substr(3)) // lo world!
例子 2
在本例中,我们将使用 substr()
从字符串中提取一些字符:
var str="Hello world!" console.log(str.substr(3,7)) // lo worl
14、substring()
定义和用法
substring()
方法用于提取字符串中介于两个指定下标之间的字符。
实例
例子 1
在本例中,我们将使用 substring()
从字符串中提取一些字符:
var str="Hello world!" console.log(str.substring(3)) // lo world!
例子 2
在本例中,我们将使用 substring() 从字符串中提取一些字符:
var str="Hello world!" console.log(str.substring(3,7)) // lo w
15、toLocaleLowerCase()
定义和用法
toLocaleLowerCase()
方法用于把字符串转换为小写。
实例
在本例中,”Hello world!” 将以小写字母来显示:
var str="Hello World!" console.log(str.toLocaleLowerCase()) // hello world!
16、toLocaleUpperCase()
定义和用法
toLocaleUpperCase()
方法用于把字符串转换为大写。
实例
在本例中,”Hello world!” 将以大写字母来显示:
var str="Hello World!" console.log(str.toLocaleUpperCase())
17、toLowerCase()
定义和用法
toLowerCase()
方法用于把字符串转换为小写。
实例
在本例中,”Hello world!” 将以小写字母来显示:
var str="Hello World!" console.log(str.toLowerCase())
18、toString()
定义和用法
toString()
方法可把一个 Number 对象转换为一个字符串,并返回结果。
实例
在本例中,我们将把一个数字转换为字符串:
var number = new Number(1337); console.log(number.toString());
19、toUpperCase()
定义和用法
toUpperCase()
方法用于把字符串转换为大写。
实例
在本例中,”Hello world!” 将以大写字母来显示:
var str="Hello World!" console.log(str.toUpperCase())
20、trim()
定义和用法
trim()
方法用于删除字符串的头尾空白符,空白符包括:空格、制表符 tab、换行符等其他空白符等。
trim()
方法不会改变原始字符串。
trim()
方法不适用于 null, undefined, Number 类型。
实例
function myTrim(x) { return x.replace(/^s+|s+$/gm,''); } function myFunction() { var str = myTrim(" mybj "); console.log(str); } myFunction() // mybj
21、valueOf()
定义和用法
valueOf()
方法可返回 String 对象的原始值。
注意:valueOf()
方法通常由 JavaScript 在后台自动进行调用,而不是显式地处于代码中。
实例
返回 String 对象的原始值:
var str="Hello world!"; console.log(str.valueOf()); // Hello world!