Detailed explanation of steps to use JS string method

This time I will bring you a detailed explanation of the steps to use the JSstring method, and what are the notes when using the JS string method. The following is a practical case, let's take a look.

1. Method reading instructions

Return value typeObject.Method name (parameter 1[, parameter two]);
Explanation:

返回值类型：指的是函数调用结束后返回的值的类型。
对象.方法名称：指的是调用方法。
参数列表：表示函数调用时传入的参数。[]表示可选参数，可写可不写。

2. String attribute

Definition: By a pair of "" or a pair of '' Wrapped, it is a string composed of 0 or more characters .
String length:

string.length;

eg:

var str1="abc";
var str2="";
var str3=" ";
console.log(str1.length);//3
console.log(str2.length);//0
console.log(str3.length);//1

3.charAt

Function: This method returns the character at the corresponding position of .
Syntax: string string.charAt(index);
Parameters: index refers to 0 to string length-1 is an integer.
Return value: Returns the character at the corresponding position of the string.

Note:

- 如果传入参数小于0或者大于 字符串长度-1，则返回空字串。
- 如果传入boolean值，如果为true，默认是转化为数字1，指到字符串第二个字符。如果为false，默认是转化为数字0，指到字符串第一个字符。
- 如果传入任意字符串，则指到字符串第一个字符。

<script>
        var str="abc";
        console.log(str.charAt(0));//a
        console.log(str.charAt(2));//c
        console.log(str.charAt(-88));//""
        console.log(str.charAt(false));//a
        console.log(str.charAt(true));//b
        console.log(str.charAt("unm"));//a
</script>

4.chatCodeAt

Function: Returns the Unicode value of the character corresponding to
Syntax: number string.charCodeAt(index);
Parameters: index refers to 0 to string length-1 is an integer.
Return value: Returns the Unicode value of the character at the corresponding position in the string.

Note:
If the incoming parameter is less than 0 or is greater than the string length -1, an empty string will be returned. NAN is returned.

<script>
    var str="abc";
    console.log(str.charCodeAt(0));//97
    console.log(str.charCodeAt(2));//99
    console.log(str.charCodeAt(-88));//NAN
    console.log(str.charCodeAt(false));//97
    console.log(str.charCodeAt(true));//98
    console.log(str.charCodeAt(undefined));//97
    console.log(str.charCodeAt("zzzz"));//97
</script>

4.fromCharCode

Function: Convert Unicode values ​​into corresponding characters.
Syntax: string String.fromCharCode(index);
Parameters: index refers to passing in any integer.
Return value: Returns the string corresponding to the Unicode value.

<script>
    console.log( String.fromCharCode( 97 ) );//a
    console.log( String.fromCharCode( 65 ) );//A
</script>

Small example of encryption and decryption

5.indexOf

Function: Returns the specified value string when calling this methodFirst timeThe position where it appears.
Syntax: number string.indexOf((searchValue [, fromIndex]));
Parameters: searchValue refers to The string to find. fromIndex refers to where to start searching. The default value is 0.
Return value: Returns a number.
Note: If it exists, the position will be returned, if it does not exist, -1 will be returned.

<script>
    var str="abcabcabc";
    console.log(str.indexOf("a"));//0
    console.log(str.indexOf("b"));//1
    console.log(str.indexOf("z"));//-1
    console.log(str.indexOf("ab"));//0
    console.log(str.indexOf("ac"));//-1
    console.log(str.indexOf("bc",0));//1
    console.log(str.indexOf("bc",-2));//1
    console.log(str.indexOf("bc",18));//-1
</script>

5.lastIndexOf

Function: Returns the specified value where the last of the string appears when this method is called.
Syntax: number string.indexOf((searchValue [, fromIndex]));
Parameters: searchValue refers to The string to find. fromIndex refers to where to start searching. The default value is str.length-1.
Return value: Returns a number.
Note: If it exists, the position will be returned, if it does not exist, -1 will be returned.

<script>
        var str="abcabcabc";
        console.log(str.lastIndexOf("a"));//6
        console.log(str.lastIndexOf("b"));//7
        console.log(str.lastIndexOf("z"));//-1
        console.log(str.lastIndexOf("ab"));//6
        console.log(str.lastIndexOf("ac"));//-1
        console.log(str.lastIndexOf("bc",0));//-1
        console.log(str.lastIndexOf("bc",-2));//-1
        console.log(str.lastIndexOf("bc",18));//7
</script>

6.slice

Function: method extracts a part of the string and returns this new string (including the starting position, not including End position)
Syntax: string string.slice((star [, end]));
Parameters: star is Refers to the interception starting position , end refers to the interception end position , the default is position 1 of the last character (the length of the string).
Return value: Return the intercepted string.

Note:

• will not exchange parameter positions according to parameter size

• If there are Negative values ​​are processed from the end. -1 refers to the last element, -2 refers to the penultimate element.

<script>
    var str="abcabc";
    console.log(str.slice(2));//"cabc"
    console.log(str.slice(0,2));//"ab"
    console.log(str.slice(2,2));//""
    console.log(str.slice(2,-1));//"cab"
    console.log(str.slice(2,-6));//""
    console.log(str.slice(2,1));//""
    console.log(str.slice(-2,-1));//"b"
</script>

7.substring

作用： 方法提取字符串中的一部分，并返回这个新的字符串（包含起始位置，不包含结束位置）
语法： string string.slice((star [, end]));
参数： star是指截取的起始位置，end是指截取的结束位置，默认为最后一个字符的位置+1 ( 字符串的长度 )。
返回值：  返回 截取后的字符串。

注意：

• 会根据起始位置和结束位置的大小先进行参数位置的变换

• 会把负值转换成0

<script>
    var str="abcabc";
    console.log(str.substring(2));//"cabc"
    console.log(str.substring(0,2));//"ab"
    console.log(str.substring(2,2));//""
    console.log(str.substring(2,-1));//"ab"
    console.log(str.substring(2,-6));//"ab"
    console.log(str.substring(2,1));//"b"
    console.log(str.substring(-2,-1));//""
</script>

8.substr

作用: 截取指定 起始位置和长度 的子字符串.
语法: string string.substr(start [, length]);
参数: start :截取的起始位置 。length:截取的字符串长度，默认为字符长度。
返回值: 返回截取后的字符串

<script>
    var str="abcabcabcabc";
    console.log(str.substr(0));//abcabcabcabc
    console.log(str.substr(3));//abcabcabc
    console.log(str.substr(3,5));//abcab
    console.log(str.substr(3,-1));""
</script>

9.toLowerCase

1.toLowerCase
作用: 把字符串全部转成小写
语法: string string.toLowerCase();
返回值: 返回转成小写的字符串。

2.toUpperCase
作用: 把字符串全部转成大写
语法: string string.toUpperCase();
返回值: 返回转成大写的字符串。

<script>
        var str = "liangZhiFANG";
        console.log( str.toLowerCase() );//"liangzhifang"
        console.log( str.toUpperCase() );//"LIANGZHIFANG"
        console.log( str );//"liangZhiFANG"
        console.log( "LoveJs".toLowerCase() );//"lovejs"
</script>

10.split

作用: 通过一个指定的字符串 把原字符串分割成一个数组。
语法: array string.split([separator] [, limit])
参数:separator是指分割符。limit指定最多分割的数量，可以理解为数组长度，默认为全部。
返回值:返回一个数组。
注意:当没有分割符的时候(没有传入参数)，整个字符串将作为一个整体保存到数组中。 用分割符分割的时候，分割符会在被删除了在传入数组。

<script>
        var str="我爱,你,们";
        console.log(str.split(","));//["我爱","你","们"]
        console.log(str.split(",",2));//["我爱","你"]
        console.log(str.split());//["我爱,你,们"]
        console.log(str.split("mmm"));//["我爱,你,们"]
        console.log(str.split(""));//["我", "爱", "," , "你", "," ,"们"]
    </script>

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

推荐阅读：

使用前端方法实现图片转字符画

实战中使用CSS技巧分享

The above is the detailed content of Detailed explanation of steps to use JS string method. For more information, please follow other related articles on the PHP Chinese website!