用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、结果展示:
结果显示为:想要的数组元素转换成大写字母的结果;
用ES6的模板标签实现,将数组中的所有元素都换成大写字母

Ⅲ、小结:

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

上一篇:合并二维数组


下一篇:【坚持每日一题6.10】1385. 两个数组间的距离值