首頁 web前端 js教程 JavaScript中的字串操作詳解_javascript技巧

JavaScript中的字串操作詳解_javascript技巧

May 16, 2016 pm 05:15 PM
javascript 字串操作

一、概述
    字串在JavaScript中幾乎無所不在,在你處理使用者的輸入資料的時候,在讀取或設定DOM物件的屬性時,在操作cookie時,當然還有更多....。 JavaScript的核心部分提供了一組屬性和方法用於通用的字串操作,如分割字串,改變字串的大小寫,操作子字串等。
    目前大部分的瀏覽器也能從強大的正規表示式獲益,因為它極大地簡化了大量的字串操作任務,不過它也需要你克服一條有些陡峭的學習曲線。在這裡,主要是介紹字串本身的一些操作,正規表示式會在以後的隨筆中涉及。

二、字串的建立
    建立一個字串有幾種方法。最簡單的是用引號將一組字元包含起來,可以將其賦值給一個字串變數。
    var myStr = "Hello, String!";
    可以用雙引號或單引號將字串包含,但要注意,一對引號作為定義字串的引號必須是相同的,不能混用。
    像var myString = "Fluffy is a pretty cat.'; 這樣的聲明就是非法的。
    允許使用兩種引號,使得某些操作變得簡單,例如將一種嵌入另一種:

複製程式碼 程式碼如下:

document.write("Logo");

    我們在上面腳本建立了幾個字串,但本質上,它們並不是真正的字串對象,確切地說,它們是字串類型的值。若要建立字串對象,可使用下列語句:var strObj = new String("Hello, String!");
    使用typeof運算子檢視會發現,上面的myStr類型為string,而strObj類型為object。

    如果想知道字串的長度,請使用其length屬性:string.length。
    得到字串的指定位置的字元使用方法:string.charAt(index);

三、字串的拼接
問題:
    將兩個或多個字串拼接為一個大的字串
解:
    非常簡單,就用一個" "將兩個字串"相加":

複製程式碼 程式碼如下:

var longString = "One piece " "plus one more piece.";

    要將多個字串累積為一個字串,也可以使用" ="運算子:
複製程式碼 程式碼如下:

var result = "";
result = "My name is Anders"
result = " and my age is 25";  

    在字串中加上換行符,需要使用轉義字元"n":




複製程式碼

程式碼如下:

var confirmString = "You did not enter a response to the last "   ;var confirmValue = confirm(confirmString);    但這種方法只能用在像警告、確認對話框之類的情況下,如果將這段文本作為HTML內容呈現,就無效了,此時用"
"代替它:



複製程式碼 程式碼如下:    var html = "First html of string. Second line of string.";document.write(htmlString);

    String物件也提供了方法concat(),它完成與" "相同的功能:
    string.concat(value1, value2, ...)
    不過concat()方法顯然不如" "來得直觀簡潔。

四、存取字串的子字串
問題:
    取得一字串的一部分的副本。
解:
    使用substring()或slice()方法(NN4 , IE4 ),以下說明它們的特定用法。
    substring()的原型為:  string.substring(from, to)
    第一個參數from指定了子字串在原字串中的起始位置(基於0的索引);第二個參數to是可選的,它指定了子字串在原字串的結束位置(基於0的索引),一般情況下,它應比from大,如果它被省略,那麼子字串將一直到原字串的結尾處。
    如果參數from不小心比參數to大了會怎麼樣? JavaScript會自動調解子字串的起止位置,也就是說,substring()總是從兩個參數中較小的那個開始,到較大的那個結束。不過要注意,它包含起始位置的那個字符,但不包含結束位置的那個字符。

複製程式碼 程式碼如下:

var fullString = "Everydog has has hisday.";
var section = fullString.substring(0, 4); // section is "Ever".
section = fullString.substring(4, 0);      // section is also "Ever".
sectionsection = fullString.substring(-2, 4);     // section is "Ever", Stringsameas full. ); 

    slice()的原型為:  string.slice(start, end)
    參數start表示子字串的起始位置,如果為負數,那麼可以理解為倒數第幾個開始,例如-3表示從倒數第三個開始;參數end表示結束位置,與start一樣,它也可以為負數,其意義也表示到倒數第幾個結束。 slice()的參數可以是負數,所以要比substring()更靈活,但沒那麼寬容了,如果 start比end要大,它將傳回一個空字串(範例略)。
    還有一個方法是substr(),其原型為: string.substr(start, length)
    從原型可以看出它的參數的意義,start表示起始位置,length則表示子字串的長度。 JavaScript標準不主張使用該方法。
五、字串的大小寫轉換
問題:
    在你的頁面上有文字框接收使用者的輸入訊息,例如城市,然後你會根據他的城市的不同做不同的處理,這時自然會用到字串比較,那麼在比較前,最好進行大小寫轉換,這樣只要考慮轉換後的情形即可;或者要在頁面上收集數據,然後將這些數據存儲在數據庫,而數據庫剛好只接收大寫字元;在這些情況下,我們都要考慮對字串進行大小寫轉換。
解決方案:
    使用toLowerCase()和toUpperCase()方法:

複製代碼 代碼如下:

var city = "ShanGHai";
city = city.toLowerCase();  // city is "shanghai" now.

六、判斷兩個字串是否相等
問題:
    例如,你想拿使用者的輸入值與已知的字串比較
解:
    先將使用者的輸入值全部轉換為大寫(或小寫),然後再來比較:

複製程式碼 程式碼如下:
 
var name = docum.form1. ();
    if(name == "urname")
    {
        // statements go here.

複製程式碼

程式碼如下:   var strA = "🎜>var strB = new String("i love you!");

    這兩個變數含有相同的字元序列,但資料型別卻不同,前者為string,後者為object,在使用"=="運算子時,JavaScript會嘗試各種求值,以偵測兩者是否會在某種情況下相等。所以下面的表達式結果為true: strA == strB。
    第二種運算子是"嚴格"的"===",它在求值時不會這麼寬容,不會進行型別轉換。所以表達式strA === strB的值為false,雖然兩個變數持有的值相同。
    有時程式碼的邏輯要求你判斷兩個值是否不相等,這裡也有兩個選擇:"!="和嚴格的"!==",它們的關係就類似於"=="和"== ="。
討論:
    "=="和"!="在求值時會盡可能地尋找值的匹配性,但你可能還是想在比較前進行顯式的類型轉換,以"幫助"它們完成工作。例如,如果你想判斷一個使用者的輸入值(字串)是否等於一個數字,你可以讓"=="幫你完成型別轉換:
    if(document.form1.txtAge.value == someNumericVar) { . .. }
    也可以提前轉換:
    if(parseInt(document.form1.txtAge.value) == someNumericVar) { ... }
    如果你比較習慣於強類型的程式語言比較例如C#,Java等),那麼這裡你可以延續你的習慣(型別轉換),這樣也會增強程式的可讀性。

    有一種狀況要注意,就是電腦的區域設定。如果用""來比較字串,那麼JavaScript把它們當作Unicode來比較, 但顯然,人們在瀏覽網頁時不會把文本當作Unicode來閱讀:) 比如在西班牙語中,按照傳統的排序,"ch"將作為一個字元排在"c"和"d"之間。 localeCompare()提供了一種方式,可以幫助你使用預設 區域設定下的字元排序規則。

複製程式碼 程式碼如下:

var strings;  // 要排序的字串陣列,要排序的字串陣列,要排序的字串陣列假設已經初始化
strings.sort(function(a,b) { return a.localeCompare(b) });  // 呼叫sort()方法進行排序

七、字串的找出
問題:
    判斷一個字串是否包含另一個字串。
解:
    使用string的indexOf()方法:
    strObj.indexOf(subString[, startIndex])
    strObjjjString[, startIndex])
    strObjjj.字串,startIndex是可選的,表示查找的開始位置(基於0的索引),如果startIndex省略,則從strObj開始處查找,如果startIndex小於0,則從0開始,如果startIndex大於最大索引,則從最大索引處開始。
    indexOf()傳回strObj中subString的起始位置,若找不到,則回傳-1。在腳本中,可以這樣使用:

程式碼如下:


if(largeString. indexOf(shortString) != -1)
    {
        // 若包含,以對應處理;
    }

    }

    }

,這時第二個參數startIndex也許會派上用場,下面這個函數示範如何求得一個字串包含另外一個字串的次數:
複製程式碼


程式碼如下:

  
🎜>        var count = 0;
        var offset = 0;
          offset = mainStr.indexOf(subStr, offset);
            if(offset != -1)
            {
                count ;
            }
        }while(offset != -1)
        return count;
        return count; String オブジェクトには、indexOf()、lastIndexOf() に対応するメソッドがあります:
strObj.lastIndexOf(substring[, startindex])
strObj は判定対象の文字列、subString は strObj の部分文字列内で検索されますstartIndex はオプションで、検索の開始位置 (0 から始まるインデックス) を示します。startIndex が省略された場合は、strObj の末尾から検索します。startIndex が 0 未満の場合は、0 から開始します。startIndex が最大インデックスより大きい場合は、0 から開始します。 , 次に最大インデックスから開始します。このメソッドは右から左に検索し、strObj 内の subString の最後の位置を返します。見つからない場合は、-1 を返します。

8. Unicode 値と文字列内の文字との間の変換
質問:
文字の Unicode エンコード値を取得し、その逆も行います。
解決策:
文字の Unicode エンコードを取得するには、次のように定義される string.charCodeAt(index) メソッドを使用できます。
strObj.charCodeAt(index)
インデックスは指定されたものです。 strObj オブジェクト位置 (0 から始まるインデックス) 内の文字の場合、戻り値は 0 ~ 65535 の 16 ビット整数です。例:

var strObj = "ABCDEFG";
var code = strObj.charCodeAt(2) // 文字「C」の Unicode 値は 67

Index で指定されたインデックスに文字が存在しない場合、戻り値は NaN になります。

Unicode エンコーディングを文字に変換するには、String.fromCharCode() メソッドを使用します。これは String オブジェクトの「静的メソッド」であるため、使用前に文字列インスタンスを作成する必要はありません。 > String.fromCharCode(c1, c2, ...)
0 個以上の整数を受け入れ、各パラメータで指定された文字を含む文字列を返します。例:

コードをコピーします コードは次のとおりです。
var str = String.fromCharCode(72, 101, 108, 108, 111); = = "Hello"

ディスカッション:
Unicode には世界中の多くの筆記言語の文字セットが含まれていますが、Unicode に文字が含まれているからといって、この文字が警告ダイアログ ボックスやテキスト ボックスで使用されたり、ページのレンダリング時に通常どおりに表示されます。文字セットが使用できない場合は、ページ上に疑問符またはその他の記号として表示されます。一般的な北米のコンピュータでは、中国語の文字セットとそのフォントがインストールされていない限り、画面に中国語の文字を表示できません。
参考:

JavaScript および Dhtml クックブック(Oreilly) ;
JavaScript-The Definitive Guide(4th Edition);

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前 By 尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

如何使用WebSocket和JavaScript實現線上語音辨識系統 如何使用WebSocket和JavaScript實現線上語音辨識系統 Dec 17, 2023 pm 02:54 PM

如何使用WebSocket和JavaScript實現線上語音辨識系統

WebSocket與JavaScript:實現即時監控系統的關鍵技術 WebSocket與JavaScript:實現即時監控系統的關鍵技術 Dec 17, 2023 pm 05:30 PM

WebSocket與JavaScript:實現即時監控系統的關鍵技術

如何使用WebSocket和JavaScript實現線上預約系統 如何使用WebSocket和JavaScript實現線上預約系統 Dec 17, 2023 am 09:39 AM

如何使用WebSocket和JavaScript實現線上預約系統

Go 語言進階教學:深入學習字串刪除操作 Go 語言進階教學:深入學習字串刪除操作 Mar 27, 2024 pm 04:24 PM

Go 語言進階教學:深入學習字串刪除操作

如何利用JavaScript和WebSocket實現即時線上點餐系統 如何利用JavaScript和WebSocket實現即時線上點餐系統 Dec 17, 2023 pm 12:09 PM

如何利用JavaScript和WebSocket實現即時線上點餐系統

簡易JavaScript教學:取得HTTP狀態碼的方法 簡易JavaScript教學:取得HTTP狀態碼的方法 Jan 05, 2024 pm 06:08 PM

簡易JavaScript教學:取得HTTP狀態碼的方法

JavaScript與WebSocket:打造高效率的即時天氣預報系統 JavaScript與WebSocket:打造高效率的即時天氣預報系統 Dec 17, 2023 pm 05:13 PM

JavaScript與WebSocket:打造高效率的即時天氣預報系統

如何在JavaScript中取得HTTP狀態碼的簡單方法 如何在JavaScript中取得HTTP狀態碼的簡單方法 Jan 05, 2024 pm 01:37 PM

如何在JavaScript中取得HTTP狀態碼的簡單方法

See all articles