微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

用ES6的模板标签实现,将数组中的所有元素都换成大写字母

Ⅰ、问题描述:

1、用 JavaScript 及 ES6 语法实现,将数组元素转换成大写字母的功能
2、分析:
A、熟悉 ES6 语法,将字符串中的变量和字符串分别放在两个数组中;
B、分别将两个数组的元素值分别转换成大写字母,再拼接起来;

Ⅱ、实现过程如下:

1、运行软件VScode,亲测可实现;
2、运行代码

<!DOCTYPE html>
<html lang="en">
<head>
  <Meta charset="UTF-8">
  <Meta http-equiv="X-UA-Compatible" content="IE=edge">
  <Meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    let name = 'Tender';
    let age = 25;
    function tag(str) {
      let res = '';  //该代码是 res 字符串的声明;
      let arr = [];  
      let arr2 = arguments[0]; //arguments 是 str 的属性,其能以 '${}' 为标记将 res2 的字符串分成三个部分,arguments[0]就代表着{0:['My name is ',',I am ',' years old']};
            
      for(var k in arguments){ //此时只能使用for in循环操作,因为 arguments 是类数组而不是真数组;
        if(k!=0){
          arr.push(arguments[k]);//push 操作,将循环出来的元素添加到 arguments 的后面;
        }
      }

      for(var key in arr){  //将 arr[0],arr[1] 和 arr2[0],arr[1] 的元素转换成大写字母;
        res += arr2[key].toupperCase() + arr[key].toString().toupperCase(); //toupperCase() 操作是将字符串转换成大写字母;  'arr[key].toString()'操作是因为在 arr[] 数组中存在元素不是字符串的情况;
      }
      res += arr2[arr2.length-1].toupperCase(); //将 arr2[2] 的元素也准换成大写字母,并拼接上去;

      console.log(res);
    }

    let res2 = tag`My name is ${name}, I am ${age} years old.`;  //此时的 tag 标签就称为模板标签; 而'${name}'值指 ES6 的模板字符串;
  </script>
</body>
</html>

3、结果展示:
结果显示为:想要的数组元素转换成大写字母的结果;

在这里插入图片描述

Ⅲ、小结:

哪里有不对或不合适的地方,还请大佬们多多指点和交流!

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

相关推荐