JS字符串拼接的幾種方式(最新推薦)
在 JavaScript 中,使用字符串連接有 幾 種方式:連接符(+)、反引號(hào)(`)、join()、concat()。
一、使用連接符 “+” 把要連接的字符串連起來
let a = 'java' let b = a + 'script' //運(yùn)行結(jié)果:javascript
說明:只連接100個(gè)以下的字符串建議用這種方法,最方便
二、使用模板字符串,以反引號(hào)( ` )標(biāo)識(shí)
ES6中新增的字符串方法,可以配合反單引號(hào)完成拼接字符串的功能
反單引號(hào)怎么打出來:將輸入法調(diào)整為英文輸入法,單擊鍵盤上數(shù)字鍵1左邊的按鍵。
用法:
1: 定義需要拼接進(jìn)去的字符串變量
2: 將字符串變量用${}包起來,再寫到需要拼接的地方
注意:反單引號(hào):` ;單引號(hào):' 。不要用錯(cuò)了喲~
實(shí)例:
let a = 'java' let b = `hello ${a}script` //運(yùn)行結(jié)果:hello javascript
三、使用數(shù)組的 join() 方法連接字符串
定義和用法:
join() 方法將數(shù)組作為字符串返回。
元素將由指定的分隔符分隔。默認(rèn)分隔符是逗號(hào) (,)。
注釋:join() 方法不會(huì)改變?cè)紨?shù)組。
語(yǔ)法:
array.join(separator)
參數(shù):
參數(shù) | 描述 |
separator | 可選。要使用的分隔符。如果省略,元素用逗號(hào)分隔。 |
返回值:
類型 | 描述 |
String | 字符串值,表示數(shù)組值,由指定的分隔符分隔。 |
實(shí)例:
let arr = ['hello','java','script'] let str = arr.join(" ") //運(yùn)行結(jié)果:hello java script
四、使用 JavaScript的 concat() 方法連接字符串
定義和用法:
concat() 方法用于連接兩個(gè)或多個(gè)字符串。
該方法沒有改變?cè)凶址菚?huì)返回連接兩個(gè)或多個(gè)字符串新字符串。
注釋:concat() 方法不會(huì)修改原字符串的值,與數(shù)組的 concat() 方法操作相似。
語(yǔ)法:
string.concat(string1, string2, ..., stringX)
參數(shù):
參數(shù) | 描述 |
string1, string2, ..., stringX | 必需。將被連接為一個(gè)字符串的一個(gè)或多個(gè)字符串對(duì)象。 |
返回值:
類型 | 描述 |
String | 兩個(gè)或多個(gè)字符串連接后生成的新字符串。 |
實(shí)例:
let a = 'java' let b = 'script' let str = a.concat(b) //運(yùn)行結(jié)果:javascript
補(bǔ)充:js字符串的拼接及轉(zhuǎn)換
字符串的轉(zhuǎn)換
toString()
數(shù)值、布爾值、對(duì)象和字符串值都有toString()方法,但是null和undefined值沒有這個(gè)方法
let num = 1; let str = num.toString(); console.log(typeof (str)); // string類型
利用函數(shù)String(變量)實(shí)現(xiàn)
在不知道變量是否為 null
或者 undefined
是可以使用 String()
函數(shù)來轉(zhuǎn)換為字符串類型
String()`函數(shù)可以將任何類型的數(shù)值轉(zhuǎn)換為字符串,意味著如果值為 `null` 那么轉(zhuǎn)換之后的結(jié)果為 `null`,如果值為 `undefined` 那么轉(zhuǎn)換之后的結(jié)果為 `undefined let num = 1 let str=String(num) console.log(typeof (str)); // string類型
利用 + 拼接字符串的方法
利用 +
實(shí)現(xiàn)轉(zhuǎn)換 (也稱之為隱式轉(zhuǎn)換)
let num = 1 let str = num + 'num1' + 'num2' console.log(typeof (str)); // string類型
字符串的拼接
使用 +
運(yùn)算符
let s1 = "karim's" let s2 = 'js' console.log(s1 + s2) // javascript
使用 concat
方法
將所有參數(shù)都轉(zhuǎn)換為字符串,按順序連接當(dāng)前字符串尾部返回連接后的字符串
let s1 = "java" let s2 = 'script' console.log(s1.concat(s2)) // javascript
利用模板字符串進(jìn)行拼接
ES6中新增的字符串方法,可以配合反單引號(hào)完成拼接字符串的功能,將字符串使用${}
包裹進(jìn)行拼接操作
let s1 = "java" let s2 = `${s1}script` console.log(s2) // javascript
利用 join()
方法連接字符串
join()` 方法將數(shù)組作為字符串返回,元素由指定分隔符進(jìn)行分隔,默認(rèn)分隔符是 `(,)
注意:join()
方法不會(huì)改變?cè)紨?shù)組
let arr=["hello","java","script"] let str=arr.join('') console.log(str) // hellojavascript
到此這篇關(guān)于JS字符串拼接的幾種方式的文章就介紹到這了,更多相關(guān)js字符串拼接內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JavaScript判斷數(shù)組的方法總結(jié)與推薦
這篇文章主要給大家介紹了關(guān)于JavaScript判斷數(shù)組方法的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2022-02-02Javascript實(shí)現(xiàn)運(yùn)算符重載詳解
本文給大家匯總介紹了Javascript實(shí)現(xiàn)運(yùn)算符重載的方法,實(shí)現(xiàn)的思路很簡(jiǎn)單,有需要的小伙伴可以來看看2018-04-04輸入自動(dòng)提示搜索提示功能的使用說明:sugggestion.txt
該js文件中的代碼實(shí)現(xiàn)了[輸入自動(dòng)搜索提示]功能,如百度、google搜索框中輸入一些字符會(huì)以下拉列表形式給出一些提示,提高了用戶體驗(yàn)2013-09-09canvas基礎(chǔ)繪制-絢麗倒計(jì)時(shí)的實(shí)例
下面小編就為大家?guī)硪黄猚anvas基礎(chǔ)繪制-絢麗倒計(jì)時(shí)的實(shí)例。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-09-09原生javascript實(shí)現(xiàn)的ajax異步封裝功能示例
這篇文章主要介紹了原生javascript實(shí)現(xiàn)的ajax異步封裝功能,結(jié)合完整實(shí)例形式分析了原生javascript實(shí)現(xiàn)的ajax異步交互函數(shù)與相應(yīng)的使用方法,需要的朋友可以參考下2016-11-11