首頁 > web前端 > js教程 > JS字串方法使用步驟詳解

JS字串方法使用步驟詳解

php中世界最好的语言
發布: 2018-05-24 16:07:40
原創
2224 人瀏覽過

這次帶給大家JS字串方法使用步驟詳解,JS字串方法使用的注意事項有哪些,下面就是實戰案例,一起來看一下。

1.方法閱讀說明

傳回值型別物件.方法名稱(參數1[,參數二]);
  解釋:

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

2.字串屬性

定義:透過一對""或一對''包起來的,由0個或多個字元組成的就是字串。
字串長度:

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

##作用: 此方法傳回對應位置的字元
語法: string string.charAt(index);
#參數: index指 0到字串長度-1 的某個一個整數。
傳回值:  傳回字串對應位置的字元

注意:

- 如果传入参数小于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

作用:傳回對應位置字元的Unicode 數值
語法: number string.charCodeAt(index);
參數: index指 0到字串長度-1 的某個一個整數。
傳回值:  傳回字串對應位置的字元的 Unicode 數值

注意:   如果傳入參數
小於0大於 字串長度-1,則傳回空字串。則返回NAN。

<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

作用:將 Unicode 數值轉換為對應的字元。
語法: string String.fromCharCode(index);
#參數: index指傳入任意的整數。
傳回值:  傳回Unicode 數值對應的字串

<script>
    console.log( String.fromCharCode( 97 ) );//a
    console.log( String.fromCharCode( 65 ) );//A
</script>
登入後複製
加密解密的小範例

5.indexOf

#作用: 傳回指定值在呼叫方法時字串首次出現的位置。
語法: number string.indexOf((searchValue [, fromIndex]));
參數: searchValue 指要查找的字串。 fromIndex 指從哪裡開始查找,預設值為0。
傳回值:  回傳 數字。
注意:如果存在 則傳回位置,不存在則回傳-1。

<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

作用: 傳回 指定值 在呼叫方法時字串最後出現的位置。
語法: number string.indexOf((searchValue [, fromIndex]));
參數: searchValue 指要查找的字串。 fromIndex 指從哪裡開始查找,預設值為str.length-1。
傳回值:  回傳 數字。
注意:如果存在 則傳回位置,不存在則回傳-1。

<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

作用: 方法提取字串中的一部分,並傳回這個新的字串(包含起始位置,不包含結束位置)
語法: string string.slice((star [, end]));
參數: star是指截取的起始位置,end是指截取的結束位置,預設為最後一個字元的位置1 ( 字串的長度)。
傳回值:  傳回 截取後的字串。

注意:

  • 不會根據參數大小

  • 交換參數位置如果參數中有負值,則處理成從末尾開始數。

    -1指最後一個元素,-2 指倒數第二個元素。

<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技巧分享

以上是JS字串方法使用步驟詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板