javascript - 将数字传递给新生成的数组时无法设置未定义的属性

Question

我正在编写代码，将句子中每个单词的首字母转换为大写，其余转换为小写。当我生成一个新数组 arr 并尝试将一个数字传递给它时，会出现错误。

Cannot set property '0' of undefined.

我不知道为什么会这样。

function titleCase(str) {

  var word = str.split(" ");
  var arr = new Array();

  for(var i = 0; i<word.length; i++){
    arr[i][0] = word[i][0].toUpperCase();
    if(word[i].length>1)
    for(var j = 1; j<word[i].length; j++){
      arr[i][j] = word[i][j].toLowerCase();
    }
  }

  str = arr.join(' ');
  return str;
}

titleCase("I'm a little tea pot");

非常感谢您的帮助!

Answer 1

arr 开始时是一个空数组，但您尝试引用(并更改其属性)arr[i] 而没有在 arr[ 处创建任何内容i] 首先:

arr[i][0] = word[i][0].toUpperCase();

要调整您现有的代码，在循环内部创建一个数组，更改那个数组，然后在末尾加入它并推送到外部arr:

function titleCase(str) {

  var word = str.split(" ");
  var arr = new Array();

  for (var i = 0; i < word.length; i++) {
    let newWordArr = [];
    newWordArr[0] = word[i][0].toUpperCase();
    if (word[i].length > 1) {
      for (var j = 1; j < word[i].length; j++) {
        newWordArr.push(word[i][j].toLowerCase());
      }
    }
    arr.push(newWordArr.join(''));
  }

  str = arr.join(' ');
  return str;
}

console.log(titleCase("I'm a little tea pot"));

但我建议改用正则表达式:将第一个非空格字符放入捕获组，同时将后续非空格字符放入不同的捕获组，然后 .replace 为第一组 .toUpperCase() 和第二组 .toLowerCase():

const titleCase = str => str
  .replace(
    /(\S)(\S*)/g,
    (_, g1, g2) => g1.toUpperCase() + g2.toLowerCase()
  );

console.log(titleCase("I'm a little tea pot"));

(\S) - 匹配并捕获单个非空格字符(进入上面的参数 g1)

(\S*) - 匹配并捕获后面的零个或多个非空格字符(进入上面的参数 g2)