es6 模板字符串

es6 新的特殊支持嵌入表達式,自動會處於``內全部的字符串。es6

多行字符串

\\傳統的多行字符串
console.log('string line1 \n\
string line2')
\\es6多行字符串
console.log(`string line
string lin2`);

表達式插入

傳統的方式採用的是字符串拼接的方式進行,經過+號進行拼接數組

// 傳統方式
 let x=1;
 let y=2;
 console.log('x='+(a+b)+';y='+(a*b))
 //es6 語法
 console.log('x='+(a+b)+';y='+(a*b));
 console.log(`x=${x+y},y=${x*y}`);

帶標籤的模板字符串

//strings 存放全部的字符串字面的數組
//values 存放第一個數組緊隨的參數
 function tag3(strings,...values){
 					  let a = 5;
					  let b = 10;
                console.log(strings[0]);//hello
                console.log(strings[1]);//world
                console.log(strings[2]);//
                console.log(values[0]);//15
                console.log(values[1]);//50
                return "hello world"
 }
  tag3 `Hello ${a+b} world ${ a*b }`;
  //out:hello world

經過傳入的參數來返回一個函數函數

function template(strings,...keys){
return (function(...values){
		var dict=values[values.length-1]||{};  //A                 
		var result=[strings[0]];
		keys.forEach(function(key,i){
		var value=Number.isInteger(key)?values[key]:dict[key];              result.push(value,strings[i+1]);
});
return result.join(' ');
});
}
var t1Closure=template `${0}${1}${0}!`;//返回的是一個函數
console.log(t1Closure('Y','A'));//Y A Y

不轉義字符串

在String.raw()輸出不轉義的字符串,輸出原始的字符串code

function tag(strings, ...values) {
/*
	假若不採用raw輸出的會直接進行換行 
*/
  console.log(strings.raw[0]); 
  // "string text line 1 \n string text line 2"
}

tag`string text line 1 \n string text line 2`;

實例

//判斷是否具備權限,假若沒有拋出一個異常
//${user.name}和${action}是兩個點佔位號,會自動將值帶入到該字符串
function authorize(user, action) {
  if (!user.hasPrivilege(action)) {
    throw new Error(
      `用戶 ${user.name} 未被受權執行 ${action} 操做。`);
  }
}
相關文章
相關標籤/搜索