捕鱼多少金币一元钱

書名： JavaScript從入門到精通（微視頻精編版）
作者名：明日科技
本章字數： 4261字
更新時間： 2020-09-01 15:02:30

8.3　String對象的方法

視頻講解

在String對象中提供了很多處理字符串的方法，通過這些方法可以對字符串進行查找、截取、大小寫轉換以及格式化等一些操作。下面分別對這些方法進行詳細介紹。

說明

String對象中的方法與屬性，字符串變量也可以使用，為了便于讀者用字符串變量執行String對象中的方法與屬性，下面的例子都用字符串變量進行操作。

8.3.1　查找字符串

字符串對象提供了幾種用于查找字符串中的字符或子字符串的方法。下面對這幾種方法進行詳細介紹。

1．charAt()方法

charAt()方法可以返回字符串中指定位置的字符。

語法如下：

    stringObject.charAt(index)

參數說明。

　stringObject：String對象名或字符變量名。

　index：必選參數。表示字符串中某個位置的數字，即字符在字符串中的下標。

說明

字符串中第一個字符的下標是0，因此，index參數的取值范圍是0~string.length-1。如果參數index超出了這個范圍，則返回一個空字符串。

例如，在字符串“你好零零七，我是零零發”中返回下標為1的字符。代碼如下：

    01  var str="你好零零七，我是零零發";  //定義字符串
    02  document.write(str.charAt(1));     //輸出字符串中下標為1的字符

查找過程示意圖如圖8.4所示。

圖8.4　查找字符示意圖

運行結果為：

好

2．indexOf()方法

indexOf()方法可以返回某個子字符串在字符串中首次出現的位置。

語法如下：

    stringObject.indexOf(substring,startindex)

參數說明。

　stringObject：String對象名或字符變量名。

　substring：必選參數。要在字符串中查找的子字符串。

　startindex：可選參數。用于指定在字符串中開始查找的位置。它的取值范圍是0到stringObject.length-1。如果省略該參數，則從字符串的首字符開始查找。如果要查找的子字符串沒有出現，則返回-1。

例如，在字符串“你好零零七，我是零零發”中進行不同的檢索。代碼如下：

    01  var str="你好零零七，我是零零發";                //定義字符串
    02  document.write(str.indexOf("零")+"<br>");        //輸出字符“零”在字符串中首次出現的位置
    03  //輸出字符“零”在下標為4的字符后首次出現的位置
    04  document.write(str.indexOf("零",4)+"<br>");
    05  document.write(str.indexOf("零零八"));           //輸出字符“零零八”在字符串中首次出現的位置

查找過程示意圖如圖8.5所示。

圖8.5　查找字符示意圖

運行結果為：

    2
    8
    -1

【例8.02】有這樣一段繞口令：四是四，十是十，十四是十四，四十是四十。應用String對象中的indexOf()方法獲取字符“四”在繞口令中的出現次數。代碼如下：（實例位置：資源包\源碼\08\8.02）

    01  var str="四是四，十是十，十四是十四，四十是四十";   //定義字符串
    02  var position=0;                                     //字符在字符串中出現的位置
    03  var num=-1;                                         //字符在字符串中出現的次數
    04  var index=0;                                        //開始查找的位置
    05  while(position!=-1){
    06     position=str.indexOf("四",index);                //獲取指定字符在字符串中出現的位置
    07     num+=1;                                        //將指定字符出現的次數加1
    08     index=position+1;                                //指定下次查找的位置
    09  }
    10  document.write("定義的字符串："+str+"<br>");        //輸出定義的字符串
    11  document.write("字符串中有"+num+"個四");            //輸出結果

運行程序，結果如圖8.6所示。

圖8.6　輸出指定字符在字符串中的出現次數

3．lastIndexOf()方法

lastIndexOf()方法可以返回某個子字符串在字符串中最后出現的位置。

語法如下：

    stringObject.lastIndexOf(substring,startindex)

參數說明。

　stringObject：String對象名或字符變量名。

　substring：必選參數。要在字符串中查找的子字符串。

　startindex：可選參數。用于指定在字符串中開始查找的位置，在這個位置從后向前查找。它的取值范圍是0到stringObject.length-1。如果省略該參數，則從字符串的最后一個字符開始查找。如果要查找的子字符串沒有出現，則返回-1。

例如，在字符串“你好零零七，我是零零發”中進行不同的檢索。代碼如下：

    01  var str="你好零零七，我是零零發";                //定義字符串
    02  document.write(str.lastIndexOf("零")+"<br>");    //輸出字符“零”在字符串中最后出現的位置
    03  //輸出字符“零”在下標為4的字符前最后出現的位置
    04  document.write(str.lastIndexOf("零",4)+"<br>");
    05  document.write(str.lastIndexOf("零零八"));       //輸出字符“零零八”在字符串中最后出現的位置

查找過程示意圖如圖8.7所示。

圖8.7　查找字符示意圖

運行結果為：

    9
    3
    -1

8.3.2　截取字符串

在字符串對象中提供了幾種截取字符串的方法，分別是slice()、substr()和substring()。下面分別進行詳細介紹。

1．slice()方法

slice()方法可以提取字符串的片斷，并在新的字符串中返回被提取的部分。

語法如下：

    stringObject.slice(startindex,endindex)

參數說明。

　stringObject：String對象名或字符變量名。

　startindex：必選參數。指定要提取的字符串片斷的開始位置。該參數可以是負數，如果是負數，則從字符串的尾部開始算起。也就是說，-1指字符串的最后一個字符，-2指倒數第二個字符，以此類推。

　endindex：可選參數。指定要提取的字符串片斷的結束位置。如果省略該參數，表示結束位置為字符串的最后一個字符。如果該參數是負數，則從字符串的尾部開始算起。

說明

使用slice()方法提取的字符串片斷中不包括endindex下標所對應的字符。

例如，在字符串“你好JavaScript”中提取子字符串。代碼如下：

    01  var str="你好JavaScript";               //定義字符串
    02  document.write(str.slice(2)+"<br>");      //從下標為2的字符提取到字符串末尾
    03  document.write(str.slice(2,6)+"<br>");    //從下標為2的字符提取到下標為5的字符
    04  document.write(str.slice(0,-6));          //從第一個字符提取到倒數第7個字符

提取過程示意圖如圖8.8所示。

圖8.8　提取字符示意圖

運行結果為：

    JavaScript
    Java
    你好Java

2．substr()方法

substr()方法可以從字符串的指定位置開始提取指定長度的子字符串。

語法如下：

    stringObject.substr(startindex,length)

參數說明。

　stringObject：String對象名或字符變量名。

　startindex：必選參數。指定要提取的字符串片斷的開始位置。該參數可以是負數，如果是負數，則從字符串的尾部開始算起。

　length：可選參數。用于指定提取的子字符串的長度。如果省略該參數，表示結束位置為字符串的最后一個字符。

注意

由于瀏覽器的兼容性問題，substr()方法的第一個參數不建議使用負數。

例如，在字符串“你好JavaScript”中提取指定個數的字符。代碼如下：

    01  var str="你好JavaScript";              //定義字符串
    02  document.write(str.substr(2)+"<br>");   //從下標為2的字符提取到字符串末尾
    03  document.write(str.substr(2,4));        //從下標為2的字符開始提取4個字符

運行結果為：

    JavaScript
    Java

【例8.03】在開發Web程序時，為了保持整個頁面的合理布局，經常需要對一些（例如，公告標題、公告內容、文章的標題、文章的內容等）超長輸出的字符串內容進行截取，并通過“…”代替省略內容。本實例將應用substr()方法對網站公告標題進行截取并輸出。代碼如下：（實例位置：資源包\源碼\08\8.03）

    01  <script type="text/javascript">
    02  var str1="明日科技即將重磅推出零基礎學系列課程"; //定義公告標題字符串
    03  var str2="明日商城熱烈歡迎新老朋友光臨惠顧";     //定義公告標題字符串
    04  var str3="本網站所有商品讓利銷售歡迎訂購";      //定義公告標題字符串
    05  var str4="所有電子商品一律5折銷售";            //定義公告標題字符串
    06  function subStr(str){
    07     if(str.length>10){                           //如果字符串長度大于10
    08        return str.substr(0,10)+"...";             //返回字符串前10個字符，然后輸出省略號
    09     }else{                                       //如果字符串長度不大于10
    10        return str;                               //直接返回該字符串
    11     }
    12  }
    13  </script>
    14  <body background="images/bg.jpeg">
    15  <div class="public">
    16    <ul>
    17     <script type="text/javascript">
    18        document.write("<li>"+subStr(str1)+"</li>");  //輸出截取后的公告標題
    19        document.write("<li>"+subStr(str2)+"</li>");   //輸出截取后的公告標題
    20        document.write("<li>"+subStr(str3)+"</li>");  //輸出截取后的公告標題
    21        document.write("<li>"+subStr(str4)+"</li>");  //輸出截取后的公告標題
    22     </script>
    23    </ul>
    24  </div>
    25  </body>

運行程序，結果如圖8.9所示。

圖8.9　截取網站公告標題

3．substring()方法

substring()方法用于提取字符串中兩個指定的索引號之間的字符。

語法如下：

    stringObject.substring(startindex,endindex)

參數說明。

　stringObject：String對象名或字符變量名。

　startindex：必選參數。一個非負整數，指定要提取的字符串片斷的開始位置。

　endindex：可選參數。一個非負整數，指定要提取的字符串片斷的結束位置。如果省略該參數，表示結束位置為字符串的最后一個字符。

說明

使用substring()方法提取的字符串片斷中不包括endindex下標所對應的字符。

例如，在字符串“你好JavaScript”中提取子字符串。代碼如下：

    01  var str="你好JavaScript";                   //定義字符串
    02  document.write(str.substring(2)+"<br>");      //從下標為2的字符提取到字符串末尾
    03  document.write(str.substring(2,6)+"<br>");    //從下標為2的字符提取到下標為5的字符

運行結果為：

    JavaScript
    Java

8.3.3　大小寫轉換

在字符串對象中提供了兩種用于對字符串進行大小寫轉換的方法，分別是toLowerCase()和toUpperCase()。下面對這兩種方法進行詳細介紹。

1．toLowerCase()方法

toLowerCase()方法用于把字符串轉換為小寫。

語法如下：

    stringObject.toLowerCase()

參數說明。

stringObject：String對象名或字符變量名。

例如，將字符串“MJH My Love”中的大寫字母轉換為小寫。代碼如下：

    01  var str="MJH My Love";              //定義字符串
    02  document.write(str.toLowerCase());  //將字符串轉換為小寫

運行結果為：

    mjh my love

2．toUpperCase()方法

toUpperCase()方法用于把字符串轉換為大寫。

語法如下：

    stringObject.toUpperCase()

參數說明。

stringObject：String對象名或字符變量名。

例如，將字符串“MJH My Love”中的小寫字母轉換為大寫。代碼如下：

    01  var str="MJH My Love";              //定義字符串
    02  document.write(str.toUpperCase());  //將字符串轉換為大寫

運行結果為：

    MJH MY LOVE

8.3.4　連接和拆分

在字符串對象中還提供了兩種用于連接和拆分字符串的方法，分別是concat()和split()。下面對這兩種方法進行詳細介紹。

1．concat()方法

concat()方法用于連接兩個或多個字符串。

語法如下：

    stringObject.concat(stringX,stringX,…)

參數說明。

　stringObject：String對象名或字符變量名。

　stringX：必選參數。將被連接的字符串，可以是一個或多個。

注意

使用concat()方法可以返回連接后的字符串，而原字符串對象并沒有改變。

例如，定義兩個字符串，然后應用concat()方法對兩個字符串進行連接。代碼如下：

    01  var nickname=new Array("東邪","西毒","南帝","北丐");      //定義人物綽號數組
    02  var name=new Array("黃藥師","歐陽鋒","段智興","洪七公");  //定義人物姓名數組
    03  for(var i=0;i<nickname.length;i++){
    04     document.write(nickname[i].concat(name[i])+"<br>");   //對人物綽號和人物姓名進行連接
    05  }

運行結果為：

    東邪黃藥師
    西毒歐陽鋒
    南帝段智興
    北丐洪七公

2．split()方法

split()方法用于把一個字符串分割成字符串數組。

語法如下：

    stringObject.split(separator,limit)

參數說明。

　stringObject：String對象名或字符變量名。

　separator：必選參數。指定的分割符。如果把空字符串（""）作為分割符，那么字符串對象中的每個字符都會被分割。

　limit：可選參數。該參數可指定返回的數組的最大長度。如果設置了該參數，返回的數組元素個數不會多于這個參數。如果省略該參數，整個字符串都會被分割，不考慮數組元素的個數。

例如，將字符串“I like JavaScript”按照不同方式進行分割。代碼如下：

    01  var str="I like JavaScript";            //定義字符串
    02  document.write(str.split(" ")+"<br>");  //以空格為分割符對字符串進行分割
    03  document.write(str.split("")+"<br>");   //以空字符串為分割符對字符串進行分割
    04  document.write(str.split(" ",2));       //以空格為分割符對字符串進行分割并返回兩個元素

運行結果為：

    I,like,JavaScript
    I, ,l,i,k,e, ,J,a,v,a,S,c,r,i,p,t
    I,like

【例8.04】　《水滸傳》是我國古典四大名著之一，書中對宋江、盧俊義、林沖、魯智深、武松等主要人物都作了詳細的描寫。現將這5個人物的名稱、綽號和主要事跡分別定義在3個字符串中，各個人物、綽號和主要事跡以逗號“，”進行分隔，應用split()方法和for循環語句將這些人物信息輸出在表格中。代碼如下：（實例位置：資源包\源碼\08\8.04）

    01  <table cellspacing="1" bgcolor="#999999">
    02    <tr height="30" bgcolor="#FFFFFF">
    03     <th align="center" width="100">人物名稱</th>
    04     <th align="center" width="100">人物綽號</th>
    05     <th align="center" width="160">主要事跡</th>
    06    </tr>
    07  <script type="text/javascript">
    08  var name="宋江，盧俊義，林沖，魯智深，武松";                  //定義人物名稱字符串
    09  var nickname="及時雨，玉麒麟，豹子頭，花和尚，行者";          //定義人物綽號字符串
    10  //定義主要事跡字符串
    11  var story="領導梁山起義，活捉史文恭，風雪山神廟，倒拔垂楊柳，醉打蔣門神";
    12  var nameArray=name.split("，");                               //將人物名稱字符串分割為數組
    13  var nicknameArray=nickname.split("，");                       //將人物綽號字符串分割為數組
    14  var storyArray=story.split("，");                             //將主要事跡字符串分割為數組
    15  for(var i=0;i<nicknameArray.length;i++){
    16     document.write("<tr height=26 bgcolor='#FFFFFF'>");          //輸出<tr>標記
    17     document.write("<td align='center'>"+nameArray[i]+"</td>");     //輸出人物名稱
    18     document.write("<td align='center'>"+nicknameArray[i]+"</td>"); //輸出人物綽號
    19     document.write("<td align='center'>"+storyArray[i]+"</td>");    //輸出主要事跡
    20     document.write("</tr>");                                   //定義</tr>結束標記
    21  }
    22  </script>
    23  </table>

運行程序，結果如圖8.10所示。

圖8.10　輸出梁山好漢人物信息

8.3.5　格式化字符串

在字符串對象中還有一些用來格式化字符串的方法，這些方法如表8.1所示。

表8.1　String對象中格式化字符串的方法

例如，將字符串“你好JavaScript”按照不同的格式進行輸出。代碼如下：

    01  var str="你好JavaScript";                                 //定義字符串
    02  document.write("原字符串："+str+"<br>");                   //輸出原字符串
    03  document.write("big："+str.big()+"<br>");                  //用大號字體顯示字符串
    04  document.write("small："+str.small()+"<br>");             //用小號字體顯示字符串
    05  document.write("fontsize："+str.fontsize(6)+"<br>");         //設置字體大小為6
    06  document.write("bold："+str.bold()+"<br>");                //使用粗體顯示字符串
    07  document.write("italics："+str.italics()+"<br>");             //使用斜體顯示字符串
    08  //創建超鏈接
    09  document.write("link："+str.link("http://www.mingribook.com")+"<br>");
    10  document.write("strike："+str.strike()+"<br>");               //為字符串添加刪除線
    11  document.write("fixed："+str.fixed()+"<br>");                 //以打字機文本顯示字符串
    12  document.write("fontcolor："+str.fontcolor("blue")+"<br>");  //設置字體顏色
    13  document.write("sub："+str.sub()+"<br>");                 //把字符串顯示為下標
    14  document.write("sup："+str.sup());                        //把字符串顯示為上標

運行程序，結果如圖8.11所示。

圖8.11　對字符串進行格式化

官术网_书友最值得收藏!

JavaScript從入門到精通（微視頻精編版）

8.3 String對象的方法

8.3.1 查找字符串

1．charAt()方法

2．indexOf()方法

3．lastIndexOf()方法

8.3.2 截取字符串

1．slice()方法

2．substr()方法

3．substring()方法

8.3.3 大小寫轉換

1．toLowerCase()方法

2．toUpperCase()方法

8.3.4 連接和拆分

1．concat()方法

2．split()方法

8.3.5 格式化字符串

8.3　String對象的方法

8.3.1　查找字符串

8.3.2　截取字符串

8.3.3　大小寫轉換

8.3.4　連接和拆分

8.3.5　格式化字符串