使用es6模板字符串嵌入变量,并实现循环「建议收藏」

使用es6模板字符串嵌入变量,并实现循环「建议收藏」模板字符串支持嵌入变量,只需要将变量名写在${}之中。在模板字符串中,遍历数组,生成循环结构。letarr=[‘aaa’,’bbbb’,’c’,’dd’,’f’]lettemp=`<ul>${arr.map(item=>{return`<li>${item}</li>`}).join(”)}</ul>`console.log(temp);/*<ul><li>aa

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

模板字符串支持嵌入变量,只需要将变量名写在 ${} 之中。

在模板字符串中,遍历数组,生成循环结构。

let arr=['aaa','bbbb','c','dd','f']
let temp=`<ul> ${ 
     arr.map(item=>{ 
      return `<li>${ 
     item}</li>`
  }).join('')}
  </ul>`
  console.log(temp);
  
  /*<ul> <li>aaa</li><li>bbbb</li><li>c</li><li>dd</li><li>f</li> </ul>*/

不添加 join('') 时,在 li标签中间多了一个逗号,这是因为当大括号中的值不是字符串时,会将其转为字符串,比如一个数组 [1, 2, 3] 就会被转为 1,2,3,逗号就是这样产生的。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/171852.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 理解图像中卷积操作的含义

    理解图像中卷积操作的含义原文地址:https://blog.csdn.net/chaipp0607/article/details/72236892?locationNum=9&amp;fps=1上文用生动的例子来解释卷积记载了卷积的含义,现在就来看看卷积在图像处理中的应用吧。(ps:本文大部分内容系转载大神的博客,现在csdn强制图片水印,实在感到很无奈!!!)数字图像处理中卷积数字图像是一个二维的离散信号,对…

    2022年5月28日
    46
  • ESP32应用指南

    一、简介。想当年,安信可公司推出一款低成本的WIFI模块(基于乐鑫公司的ESP8266芯片)之后,火了一段时间。这个模块是支持AT指令和SDK两种开发方式。AT指令很简单,用串口发送几条指令,即可让模块进入串口透传模式,用户基本不用涉及复杂的TCP/IP协议。SDK开发,相当于固件库开发,官方提供丰富的例子,有带操作系统和不带操作系统等等,代码可读性好,上手难度并不高。由于ESP8…

    2022年4月8日
    282
  • idea激活码2022.01【中文破解版】

    (idea激活码2022.01)本文适用于JetBrains家族所有ide,包括IntelliJidea,phpstorm,webstorm,pycharm,datagrip等。https://javaforall.net/100143.htmlIntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,上面是详细链接哦~4…

    2022年4月2日
    114
  • Java连接MySQL mysql-connector-java-bin.jar驱动包的下载与安装

    Java连接MySQL mysql-connector-java-bin.jar驱动包的下载与安装eclipse在连接mysql数据库的时候要通过mysql驱动包进行连接首先进入官网中—-官网地址:https://dev.mysql.com/进入官网中选择DOWNLOADS(下载)2.选择下载中的mysql-connectors3.选择connector/JJ指的是Java4.接下在选择操作系统,此处选择platformindependent(独立于平台)…

    2022年5月21日
    1.1K
  • Repeater嵌套DataList

    Repeater嵌套DataList&lt;%@PageLanguage="C#"AutoEventWireup="true"CodeBehind="RepeaterDemo.aspx.cs"Inherits="OldbSiteMapProviderDemo.RepeaterDemo"%&gt;&lt;!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitiona

    2022年7月14日
    25
  • linux安装p12,用命令行安装mobileprovision和p12证书

    linux安装p12,用命令行安装mobileprovision和p12证书我这边使用python来编写的,基本达到了最大化程度的解耦,其他人或者其他地方都可以直接使用。先创建installMobileProfile.py#!/usr/bin/python#-*-coding:UTF-8-*-importsysimportcommandsimportosparamsCount=len(sys.argv)if(paramsCount!=5):prin…

    2022年6月22日
    55

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号