Javascript 将元素添加到特定索引处的数组并移除 "Join" 分隔符

Question

我知道这个问题已被问过很多次，但我找不到解决我的具体问题的方法。我猜我需要完全重构我的代码，但可以使用一些指导。

我正在 Javascript 练习 OOP。我想加入一个数组并在最后一个元素之前添加一个“和”连词。这样 [1, 2, 3] ==> "1, 2, 3".

我已将我的代码包含在下面的注释中。正如您将看到的，我得到的当前输出是“1、2 和 3”。我怎样才能去掉多余的逗号？我是不是用错了方法？

class Person {
  constructor(first, last, age, gender, interests) {
    this.name = {
      first: first,
      last: last,
    };
    this.age = age;
    this.gender = gender;
    this.interests = interests;
  }

  greeting() {
    console.log(`Hi! I'm ${this.name.first} ${this.name.last}.`)
  }

  bio() {
    // store the index of the last element of the array in a variable called index
    let index = this.interests.length - 1;
    // store the conjunction for end of array
    let conjunction = " and"
    // insert the conjunction before last element in array
    this.interests.splice(index, 0, conjunction)
    // join the array into a string separated by commas
    let interestsString = this.interests.join(", ");
    console.log(interestsString);
  }
}

let person1 = new Person('test', 'test', '29', 'Male', ['skiing', 'cooking', 'gardening']);

console.log(person1.bio());

Answer 1

使用Intl.ListFormat()将列表转换为字符串，同时处理分隔符和连词：

const listFormatter = new Intl.ListFormat('en', { style: 'long', type: 'conjunction' });

class Person {
  constructor(first, last, age, gender, interests) {
    this.name = {
      first: first,
      last: last,
    };
    this.age = age;
    this.gender = gender;
    this.interests = interests;
  }

  greeting() {
    console.log(`Hi! I'm ${this.name.first} ${this.name.last}.`)
  }

  bio() {
    return listFormatter.format(this.interests);
  }
}

let person1 = new Person('test', 'test', '29', 'Male', ['skiing', 'cooking', 'gardening']);

console.log(person1.bio());

另一种选择是使用数组操作 - 如果数组只包含一个项目，return 该项目。如果它包含多个项目，则创建一个包含所有原始项目的新数组，但最后一个项目在添加“and”后返回最后一个项目。加入阵营。

class Person {
  constructor(first, last, age, gender, interests) {
    this.name = {
      first: first,
      last: last,
    };
    this.age = age;
    this.gender = gender;
    this.interests = interests;
  }

  greeting() {
    console.log(`Hi! I'm ${this.name.first} ${this.name.last}.`)
  }

  bio() {
    return this.interests.length > 1 // if there are multiple items
      ?
      [
        ...this.interests.slice(0, -1), // get all items but the last
        `and ${this.interests.at(-1)}` // add the last item with "and"
      ].join(', ') // join
      :
      this.interests.at(0); // just take the single existing item
  }
}

let person1 = new Person('test', 'test', '29', 'Male', ['skiing', 'cooking', 'gardening']);

console.log(person1.bio());

Answer 2

这是您需要的一种方法。

class Person {
  constructor(first, last, age, gender, interests) {
    this.name = {
      first: first,
      last: last,
    };
    this.age = age;
    this.gender = gender;
    this.interests = interests;
  }

  greeting() {
    console.log(`Hi! I'm ${this.name.first} ${this.name.last}.`)
  }

  bio() {
    let interestsString = this.interests.join(', ').replace(/, ([^,]*)$/, ' and ')
    console.log(interestsString);
  }
}

let person1 = new Person('test', 'test', '29', 'Male', ['skiing', 'cooking', 'gardening']);

console.log(person1.bio());

Answer 3

当你这样使用拼接时

 this.interests.splice(index, 0, conjunction)

您向数组添加元素，然后连接函数添加了另一个“,” 最好只更改它自己的元素并向其添加 and。

像这样：

    let changeTo = conjunction + this.interests[index];
    this.interests.splice(index, 1, changeTo);

Javascript 将元素添加到特定索引处的数组并移除 "Join" 分隔符

Javascript Add Element To Array At Specific Index and Remover "Join" Separator

javascript

arrays

oop

string

class