es5与es6常用语法教程(3)

es5与es6常用语法教程(3)

js常用语法系列教程如下 es5与es6常用语法教程(1) es5与es6常用语法教程(2) es5与es6常用语法教程(3) es5与es6常用语法教程(4) es5与es6常用语法教程(5) es5与es6常用语法教程(6) es5与es6常用语法教程(7) 这部分教程我们主要讲解以下几个常用语法 模板字符串 带...

js常用语法系列教程如下

这部分教程我们主要讲解以下几个常用语法

  • 模板字符串
  • 带标签的模板字符串
  • 判断字符串中是否包含其他字符串
  • 给函数设置默认值

模板字符串

  • 老式的拼接字符串方法
let dessert = '🍰', drink = '🍵'

let breakfast = '今天的早餐是 ' + dessert + ' 与 ' + drink + ' !'

console.log(breakfast) // 输出:今天的早餐是 🍰 与 🍵 !
  • 模版字符串拼接方法
let dessert = '🍰', drink = '🍵'

let breakfast  = `今天的早餐是 ${dessert} 与 ${drink} !`

console.log(breakfast) // 输出:今天的早餐是 🍰 与 🍵 !

模板字符串使用方法

  • 在变量的周围添加一组{}
  • {}左边添加一个$
  • 再用反引号包裹这个字符串

带标签的模块字符串

let dessert = '🍰', drink = '🍵'

let breakfast = kitchen`今天的早餐是${dessert} 与 ${drink}!`

function kitchen(strings, ...values){
  console.log(strings) // 输出:["今天的早餐是", " 与 ", "!"]
  console.log(values) // 输出:["🍰", "🍵"]
}

breakfast
  • strings:是一个数组,元素是模板字符串中的字符串片段
  • values:是一个数组, 元素是模块字符串中使用{}包裹的内容
  • 在模块字符串的前面添加一个标签,这个标签处理模块字符串中的字符和插入的值,这里的标签是一个函数

判断字符串中是否包含其它字符串

  • startsWith():判断一个字符串是否以某一个字符串开头
  • endsWith():判断一个字符串是否以某一个字符串结尾
  • includes():判断一个字符串是否包含某一个字符串
let dessert = '🍰', drink= '🍵'

let breakfast = `今天的早餐是 ${ dessert } 与 ${ drink } !`

console.log(
  breakfast .startsWith('今天'), // 输出:true
  breakfast .endsWith('!'), // 输出:true
  breakfast .includes('早餐是') // 输出:true
)

给函数设置默认值

function breakfast (dessert = '🍰', drink = '🍺') {
  return `${ dessert }${ drink }`
}

// 这里 🍰和 🍺是函数breakfast设置的默认参数值,当调用这个函数时没有给参数时,这时就会使用函数默认的参数值

// 调用函数
breakfast () // 输出:🍰 🍺
breakfast (🍌, 🍊) // 输出:🍌 🍊

文章来源于互联网:es5与es6常用语法教程(3)

0

评论0

鱼翔浅底,鹰击长空,驼走大漠
没有账号? 注册  忘记密码?