JavaScript字符串包含問題
在任何編程語言中,檢查字符串是否包含子字符串都是常見的任務(wù)。
例如,假設(shè)您正在構(gòu)建在線游戲。
您可能需要檢查用戶名是否包含禁止使用的短語,以確保所有用戶名都適合您的游戲。
JavaScript字符串包含
有三種方法可檢查JavaScript字符串是否包含另一個字符或字符序列:
- includes()
- indexOf()
- 正則表達式(regex)
在本教程中,我們將討論可以使用這三種方法來檢查JavaScript字符串是否包含另一個字符串的方法。
includes()
ES6中引入的JavaScript include()方法確定字符串是否包含您傳遞給該方法的字符。如果字符串包含某些字符,則該方法將返回“ true”。
如果指定的字符串不包含您要查找的字符,則includes()將返回“ false”。
includes()方法的語法為:
string.includes(word);
值“字符串”是指我們將搜索的字符。“單詞”是指我們要查找的字符。
這是一個實際使用includes()方法的示例:
let example = "Example String!"; let ourSubstring = "Example"; ? if (example.includes(ourSubstring)) { ? ? console.log("The word Example is in the string."); } else { ? ? console.log("The word Example is not in the string."); }
我們的代碼返回:字符串中包含示例字。
在前兩行,我們聲明了兩個JavaScript變量。第一個變量是我們要搜索的字符串。第二個是我們要在原始字符串中找到的子字符串。換句話說,我們將搜索第一個變量是否包含第二個變量的內(nèi)容。
接下來,我們使用if語句評估“ example”變量是否包含“ ourSubstring”變量的內(nèi)容。
如果“示例”中包含“示例”一詞,則我們的陳述為“真”。這意味著將運行“ if”語句主體中的console.log()語句。否則,將運行我們的“ else”語句。
- includes()區(qū)分大小寫,因此,如果我們更改子字符串的大小寫,將返回“ false”。
- includes()第二個參數(shù)
- includes()方法使您可以指定第二個參數(shù)。第二個參數(shù)是索引號,includes()應(yīng)該從該索引號開始搜索您的子字符串。第一個字符的索引為“ 0”,第二個字符的索引為“ 1”,依此類推。這是因為列表從零開始索引。
讓我們檢查一下單詞“ Example”是否出現(xiàn)在字符串的索引位置7之后:
let example = "Example String!"; let ourSubstring = "Example"; ? if (example.includes(ourSubstring, 7)) { ? ? console.log("The word Example is in the string."); } else { ? ? console.log("The word Example is not in the string"); }?
includes()方法返回字符串開始的索引位置。我們的代碼返回“示例單詞不在字符串中。” 盡管我們的字符串中確實包含單詞“ Example”,但該單詞出現(xiàn)在索引值“ 7”之前,該值是“ Example”和“ String!”之間的空格。
indexOf()
像include()一樣,JavaScript indexOf()方法檢查一個字符串是否包含另一個字符串。這兩個函數(shù)的輸出不同。
當我們使用include()方法時,該方法返回一個布爾值:true或false。indexOf()返回子字符串的起始索引位置?;蛘?,如果字符串不包含子字符串,我們將得到“ -1”。
讓我們看一下該方法的語法:
string.indexOf(word);
就像在我們的include()示例中一樣,“字符串”指的是我們通過其搜索的值。“單詞”是我們要搜索的短語或字符。
這是JavaScript中indexOf()的示例:
let example = "Example String!"; let ourSubstring = "Example"; ? if (example.indexOf(ourSubstring) != -1) { ? ? console.log("The word Example is in the string."); } else { ? ? console.log("The word Example is not in the string."); }?
我們的代碼返回:字符串中包含示例字。就像在上一個示例中一樣,我們使用了“ if”語句。根據(jù)我們的字符串是否包含子字符串,此語句向控制臺顯示一條特定消息。
我們檢查indexOf()方法是否不返回-1。如果是這樣,則運行“ else”語句。-1表示找不到我們的字符串。否則,將執(zhí)行“ if”語句中的代碼。
像include()方法一樣,indexOf()區(qū)分大小寫。如果我們希望搜索從某個索引值開始,則可以使用另一個參數(shù):
let example = "Example String!"; let ourSubstring = "Example"; ? if (example.indexOf(ourSubstring, 7) != -1) { ? ? console.log("The word Example is in the string."); } else { ? ? console.log("The word Example is not in the string."); }?
由于找不到從索引值7開始的完全匹配,因此我們的代碼返回-1。
正則表達式
我們還可以利用JavaScript正則表達式(或regex)來檢查字符串是否包含子字符串。正則表達式由于其靈活性而非常有用:您可以對搜索內(nèi)容和位置進行大量控制。
我們可以使用RegExp.test()方法檢查字符串是否包含子字符串。
這是一個例子:
let str = "Example String!";? /Example/.test(str);
我們的代碼返回true。這是因為“ JavaScript”在我們的“示例”字符串中。
正則表達式功能強大。正則表達式的缺點是運行速度會變慢,具體取決于您使用的規(guī)則。添加到正則表達式規(guī)則中的語句越多,搜索所需的時間就越長。
如果您執(zhí)行的是簡單搜索并且不需要高級字符串函數(shù),則使用include()或indexOf()可能是一種更好的方法。不建議RegExp.test()方法用于尚未了解Regex的初學(xué)者。
如果您想了解有關(guān)正則表達式的更多信息并測試正則表達式,請查看RegExr。
結(jié)論
在本教程中,我們討論了JavaScript中字符串的基礎(chǔ)。之后,我們討論了三種檢查字符串是否包含JavaScript中的子字符串的方法:使用include(),indexOf()和regex。
include()方法可以說是檢查字符串是否包含子字符串的最常用方法。這是因為方法的名稱是文字。顯然include()允許您在另一個字符串中搜索一個字符串。
以上為個人經(jīng)驗,希望能給大家一個參考,也希望大家多多支持腳本之家。
- JS中判斷某個字符串是否包含另一個字符串的五種方法
- js判斷一個字符串是否包含一個子串的方法
- JS獲取字符串實際長度(包含漢字)的簡單方法
- javascript 判斷字符串是否包含某字符串及indexOf使用示例
- js判斷數(shù)組是否包含某個字符串變量的實例
- 用javascript實現(xiàn)截取字符串包含中文處理的函數(shù)
- JS判斷字符串包含的方法
- js計算字符串長度包含的中文是utf8格式
- JS實現(xiàn)快速比較兩個字符串中包含有相同數(shù)字的方法
- JS不用正則驗證輸入的字符串是否為空(包含空格)的實現(xiàn)代碼
- JavaScript判斷一個字符串是否包含指定子字符串的方法
- JS中append字符串包含onclick無效傳遞參數(shù)失敗的解決方案
- JS給Array添加是否包含字符串的簡單方法
- js處理包含中文的字符串實例
- javascript自動生成包含數(shù)字與字符的隨機字符串
- JavaScript獲取字符串實際長度(包含中英文)
- JavaScript面試中常考的字符串操作方法大全(包含ES6)
- js 判斷字符串中是否包含某個字符串的實現(xiàn)代碼
相關(guān)文章
使用webpack搭建pixi.js開發(fā)環(huán)境
這篇文章主要介紹了使用webpack搭建pixi.js開發(fā)環(huán)境,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習或者工作具有一定的參考學(xué)習價值,需要的朋友們下面隨著小編來一起學(xué)習學(xué)習吧2020-02-02Javascript創(chuàng)建Silverlight Plugin以及自定義nonSilverlight和lowSilverl
我們在使用Visual Studio IDE創(chuàng)建Silverlight工程時,默認情況下都會自動生成一個用于調(diào)試和預(yù)覽Silverlight的Web工程,該工程包含了html和aspx頁面,以及Silverlight.js腳本文件。2010-06-06Jquery和JS用外部變量獲取Ajax返回的參數(shù)值的方法實例(超簡單)
Jquery和JS用外部變量獲取Ajax返回的參數(shù)值的方法實例(超簡單),需要的朋友可以參考一下2013-06-06JavaScript 進度條實現(xiàn)代碼(Firefox等相似瀏覽器下不支持)
JavaScript實現(xiàn)的進度條,可惜在Firefox等相似瀏覽器下不支持(遠程)2009-07-07微信小程序列表時間戳轉(zhuǎn)換實現(xiàn)過程解析
這篇文章主要介紹了微信小程序列表時間戳轉(zhuǎn)換實現(xiàn)過程解析,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習或者工作具有一定的參考學(xué)習價值,需要的朋友可以參考下2019-10-10javascript innerText和innerHtml應(yīng)用
innerText和innerHtml看字面也應(yīng)該理解的了2010-01-01如何在JavaScript中等分數(shù)組的實現(xiàn)
這篇文章主要介紹了如何在JavaScript中等分數(shù)組的實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學(xué)習或者工作具有一定的參考學(xué)習價值,需要的朋友們下面隨著小編來一起學(xué)習學(xué)習吧2020-12-12