ES6基礎(chǔ)語(yǔ)法之字符串?dāng)U展
一、字符串的遍歷
JS中遍歷字符串:
var str = "hello,world";
for(var i = 0;i<str.length;i++)
{
console.log(str[i]);
}ES6擴(kuò)展的遍歷字符串方法:
let str = "hello,world";
for(let c of str)
{
console.log(c);
}二、字符串識(shí)別、重復(fù)、補(bǔ)全
字符串識(shí)別:
ES6 之前判斷字符串是否包含子串,用 indexOf 方法,ES6 新增了子串的識(shí)別方法。
includes():返回布爾值,判斷是否找到參數(shù)字符串。
startsWith():返回布爾值,判斷參數(shù)字符串是否在原字符串的頭部。
endsWith():返回布爾值,判斷參數(shù)字符串是否在原字符串的尾部。
以上三個(gè)方法都可以接受兩個(gè)參數(shù),需要搜索的字符串,和可選的搜索起始位置索引。
let str = "jack,rose,mike";
console.log(str.includes("rose")); //true
console.log(str.includes("rose",5)); //true
console.log(str.startsWith("jack")); //true
console.log(str.startsWith("rose",5));//true
console.log(str.endsWith("mike")) //true
console.log(str.endsWith("se",9)) //true(前面9個(gè)字符中去查找判斷)字符串重復(fù):
repeat():返回新的字符串,表示將字符串重復(fù)指定次數(shù)返回
let str = "hello,"; console.log(str.repeat(3));
字符串補(bǔ)全:
padStart:返回新的字符串,表示用參數(shù)字符串從頭部(左側(cè))補(bǔ)全原字符串。
padEnd:返回新的字符串,表示用參數(shù)字符串從尾部(右側(cè))補(bǔ)全原字符串。
//使用padStart補(bǔ)全編號(hào) let id = 25; console.log((id+"").padStart(6,"0"));
三、模板字符串
模板字符串相當(dāng)于加強(qiáng)版的字符串,用反引號(hào) `,除了作為普通字符串,還可以用來(lái)定義多行字符串,還可以在字
符串中加入變量和表達(dá)式。
多行字符串使用:
//方案一:普通字符串換行 // let str = `I Love JS\nI Love ES`; // console.log(str); //方案二:多行字符串 // let str = `I Love JS // I Love ES`; // console.log(str);
字符串中插入變量:
//方案一:JS拼接字符串
// var name = "佩奇"; //保存姓名
// var hobby = "游戲,運(yùn)動(dòng),看書(shū)"; //保存愛(ài)好
// var obj = document.getElementById("content");
// obj.innerHTML = "<h2>大家好,我是"+name+",我的愛(ài)好有"+hobby+"</h2>";
//方案二:ES6模板字符串
// let name = "佩奇"; //保存姓名
// let hobby = "游戲,運(yùn)動(dòng),看書(shū)"; //保存愛(ài)好
// let obj = document.getElementById("content");
// obj.innerHTML = `<h2>大家好,我是${name},我的愛(ài)好有${hobby}</h2>`;//字符串中嵌入變量
// let [name,hobby] = ["jack","抽煙,喝酒,燙頭"];
// let str = `大家好,我是${name},我喜歡${hobby}`;
// console.log(str);模板字符串的注意點(diǎn):
//(1)如果模板字符串中需要表示反引號(hào),用\轉(zhuǎn)義
// let str = `\`hello\``;
// console.log(str);
//(2)模板字符串內(nèi)可以放入表達(dá)式
// let x = 5;
// let y = 6;
// let str = `${x}*${y}=${x*y}`;
// console.log(str);
//(3)模板字符串中可以調(diào)用函數(shù)
// function fun()
// {
// return "hello,world!";
// }
// let str = `測(cè)試函數(shù)調(diào)用:${fun()},調(diào)用成功!`;
// console.log(str);使用模板字符串輸出列表:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>模板字符串中輸出列表</title>
</head>
<body>
<div id="content">
</div>
</body>
<script>
let [pro1,pro2,pro3,pro4]=["計(jì)算機(jī)技術(shù)","電子商務(wù)","國(guó)際貿(mào)易","工商管理"];
let str = `
<h2>專(zhuān)業(yè)列表如下</h2>
<ul>
<li>${pro1}</li>
<li>${pro2}</li>
<li>${pro3}</li>
<li>${pro4}</li>
</ul>
`;
document.getElementById("content").innerHTML=str;
</script>
</html>到此這篇關(guān)于ES6基礎(chǔ)語(yǔ)法之字符串?dāng)U展的文章就介紹到這了。希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript高級(jí)程序設(shè)計(jì)(第3版)學(xué)習(xí)筆記6 初識(shí)js對(duì)象
砌好墻,下面出場(chǎng)的就是房子了,在ECMAScript中,對(duì)象就是我們所說(shuō)的房子,至于你所寫(xiě)的整個(gè)應(yīng)用程序,那就是一整套建筑群了2012-10-10
JavaScript的類(lèi)型簡(jiǎn)單說(shuō)明
JavaScript變量有2中類(lèi)型:原始類(lèi)型和引用值類(lèi)型。2010-09-09
Javascript創(chuàng)建類(lèi)和對(duì)象詳解
使用Javascript創(chuàng)建類(lèi)和對(duì)象的方法有很多,現(xiàn)在就來(lái)列舉一下:1、原始的創(chuàng)建方法,2、工廠方法模式,3、構(gòu)造方法模式,4、動(dòng)態(tài)原型方法。下面我們就來(lái)通過(guò)實(shí)例詳細(xì)看下2017-05-05

