欢迎光临
我的个人博客网站

ES6-字符串-模板字符串(复习+学习)

  

  昨天学习了字符串对象和字符串的表示,就是利用utf-8等不同的编码方式,还有许多的对象方法,都是处理字符串的方法,挺方便的,今天我学习了一下字符串模板,这里记录i一下学习的笔记,当然,今天学习了部分内容,如果笔记有没涉及到的,可以再自行学习,话不多说,这次笔记分为两部分:

 

1.传统的字符串输出

2.字符串模板

 

  正文开始:

 

 

 

 

 

 

1.传统的字符串输出

1 //传统的字符串输出模板就是字符串的连接问题,无非就是字符串与字符串之间用+号连接,然后其中还有一部分就是转义字符,必须由转义字符控制模板 2 let a = 1; 3 'this is' +a+'nabcd '   //该句话就表示有个a的值和一个换行符号在其中控制着该输出的字符串   4 //结果: 5 // this is 1 6 //abc  

 

 

 

 

 

2.字符串模板

 1 //看完传统的字符串的输出模板,你会发现写个变量还要加加加,还需要转义字符来控制,想当的烦恼,而字符串模板的引入就是为了解决这个问题  2 //1.字符串模板是利用 ` 来定义的,可以定义多行字符,当然也可以镶嵌变量,模板可以换行和空格,还有缩进。  3 //(1)镶嵌变量${变量}  4 var name = "andy";  5 console.log(`my name is ${name}`);   // 输出的就是my name is andy  镶嵌变量  6 //(2)模板可换行  7 console.log('one line n two line')   // 输出可想而知,传统字符串输出  8 console.log(`one line  9              two line` )              //  与上面传统输出一样,但是写法不一样 10 //(3)模板字符串里面想用`` 11 var a = `you ` moban`zifuchuan`   //you `moban` zifuchuan; 12 //(4)不想用换行可以用trim方法消除 13 ${'.ac'}/html(` 14     <li>one<li> 15     <li>two<li> 16 `.trim()); 17 //(5)大括号里面可以放置对象属性(调用对象的时候,默认调用对象的toString方法)或者运算式,或者js的表达式 18 let x =1; 19 let y = 2; 20 21 `${x} + ${y} = ${x+y}`;  /1+2 =3; 22 //(6)模板字符串中可以调用函数 23 function f(){ 24 return "hellow"; 25 } 26 27 `foo ${f()} bar`; 28 //(7)模板字符串里大括号里面还是字符串仍旧输出字符串 29 //(8)模板字符串中的变量或者函数没定义仍旧会报错 30 //(9)模板字符串可以嵌套(无非就是模板里面套模板一样一样的)

 



 

 

 

 

  今天模板字符串就简单学习这么多吧,具体还有字符串模板,还有对应的新的方法、当然任何都不是绝对完美的,想了解的可以查阅一下模板字符串的缺点,但是相对于传统的字符串肯定要好很多,如果有其他想要一起探讨的可以下面评论,比如没提到的知识,可以在评论区增加!!明天也要努力呀!!ES6-字符串-模板字符串(复习+学习)

 

 

 

赞(0) 打赏
未经允许不得转载:张拓的天空 » ES6-字符串-模板字符串(复习+学习)
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

专业的IT技术经验分享 更专业 更方便

联系我们本站主机

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏