ES6學習筆記 字串 函式

2021-09-16 12:06:32 字數 2819 閱讀 2822

es6對字串新增了很多方便的功能，下面我們可以逐一來看一下。

1.字串格式化

將表示式嵌入字串中進行拼接。用${}來界定。

//es5


var name = 'will'


console.log('hello' + name)


//es6


var name = 'will';


console.log(`hello $`)
2.includes:判斷是否包含然後直接返回布林值

const str = 'will'


console.log(str.includes('y')) //true
3.repeat:獲取字串重複n次

const str = 'he'


console.log(str.repeat(3)) //'hehehe'
如果你帶入小數，則按照math.floor(num)來處理

也就是s.repeat(3.1)-s.repeat(3.9)都按照3來處理

4.startswith 和 endswith 判斷是否以 給定文字 開始或者結束

const str = 'will is so cool!'


console.log(str.startswith('will')) //true


console.log(str.endswith('!')) //true
5.padstart 和 padend 填充字串，應用場景：時秒分

setinterval(() => :$:$`)


}, 1000)
常用的就這五個，如果有用到新的，我再新增。

然後來兩道小測試題搞一下。

let address = '北京海淀區'


let name = 'lala'


let str = '$在$上班...'


// 模擬乙個方法 mytemplate(str) 最終輸出 'lala在北京海淀區上班...'


function mytemplate(str) 


console.log(mytemplate(str)) // lala在北京海淀區上班...
const name = 'cc'


const gender = 'male'


const hobby = 'basketball'


// 實現tag最終輸出 '姓名：**cc**，性別：**male**，愛好：**basketball**'


function tag(strings) 


const str = tag`姓名：$，性別：$，愛好：$`


console.log(str) // '姓名：**cc**，性別：**male**，愛好：**basketball**'
es5中，給函式定義引數預設值。

function action(num)
但es5乙個特別坑爹的地方就是，當我們num傳入0的時候，es5會自動把他識別為false，這和我們實際的需求相背而馳，這個時候我們es6就粉墨登場了。

es6為引數提供了預設值。在定義函式時便初始化了這個引數，以便在引數沒有被傳遞時使用。

function action（num = 200）


action(0) //0


action() //200


action(300) //300
箭頭函式

我記得前段時間在面試東科電力的時候，面試老哥問我，普通函式和箭頭函式的區別，我幾乎脫口而出說寫法簡單了，那老哥一下子就笑了。我至今也沒明白他到底是為啥笑，人有魅力真是一件令人困擾的事情。

言歸正傳，我們來看一下箭頭函式最直觀的三個特點。

1.不需要function關鍵字來定義函式

2.省略return關鍵字

3.繼承當前上下文的this關鍵字

[1,2,3].map(x => x + 1)


//等同於


[1,2,3].map((function(x)).band(this))
說個小細節。

當你的函式有且僅有乙個引數的時候，是可以省略掉括號的。當你函式有且僅有乙個表示式的時候可以省略{}和 return；例如

var people = name => 'hello' + name
作為參考

var people = (name,age) =>
這個因為傳入了兩個引數 缺少()或者{}都會報錯。

來，老鐵，整道測試題吧。

// 請使用es6重構以下**


var calculate = function(x, y, z) 


if (typeof y != 'number') 


var dwt = x % y


var result


if (dwt == z) 


if (dwt != z) 


return result


}
const calculate = (x,y,z) =>

ES6學習筆記 字串擴充套件

這三個方法都支援第二個引數，表示開始搜尋的位置。var s hello world s.startswith world 6 true s.endswith hello 5 true s.includes hello 6 false返回乙個新字串，表示將原字串重複n次 x repeat 3 hell...

字串的擴充套件 ES6學習筆記

1.字串的遍歷器介面 es6為字串新增了遍歷器介面，使得字串可以被for of迴圈遍歷。字串的遍歷 for of與for迴圈的區別 for of可以識別大於0xffff的碼點，for迴圈無法識別大於0xffff的碼點。let text string.fromcodepoint 0x20bb7 for...

ES6模板字串

es6提供了模板字串使字串的拼接以及模板的編寫變得特別簡單,組合字串的時候不在需要加號單引號這些，直接使用一對反引號即可，而且字串中需要變數的時候直接 的這種方式，大括號裡面可以是任何的js表示式，變數，物件的屬性，還可以是乙個函式，模板字串還可以進行巢狀。const person lili con...