Javascript 在加入多个数组时防止冗余

Question

我有一个创建长链接的函数。它通过让人们点击属于多个问题的多个答案来做到这一点。每个问题及其答案都属于多维数组的一部分。

链接创建者：

        /**
         * Returns the parameters for the URL.
         *
         * @returns {string}
         */
        getLink() {
            let quizUrl = control.url[control.questionNumber];
            this.tmp = [];
            for (let i = 0; i < this.url.length; i++) {
                // Check if question is from the same quiz part and adds a , between chosen answers and add the right prefix at the beginning
                if (this.url[i].length > 0) {
                    this.tmp.push("" + Quiz[i].prefix + this.url[i].join(","))
                    // console.log(this.url)
                }
                    if (this.url[i].length === 0) {
                        this.tmp.push("");
                }
                // console.log(quizUrl.length)
                console.log(this.tmp);
            }
            /// If answers are from different quiz parts add a & between answers.
            return "" + this.tmp.join("&");
        };

数组：

    class QuizPart {
        constructor(questionText, chosenAnswer, prefix, questionDescription) {
            this.questionText = questionText;
            this.chosenAnswer = chosenAnswer;
            this.prefix = prefix;
            this.questionDescription = questionDescription;
        }
    }

    class ChosenAnswer {
        constructor(id, name) {
            this.id = id;
            this.name = name;
        }
    }

    let Quiz = [
        new QuizPart('Whats your size?', [
                new ChosenAnswer('6595', '41'),
                new ChosenAnswer('6598', '42'),
                new ChosenAnswer('6601', '43'),
                new ChosenAnswer('', ''),
            ], 'bd_shoe_size_ids=',
            'The size of your shoes is very important. If you have the wrong size, they wont fit.'),

        new QuizPart('What color would you like?', [
                new ChosenAnswer('6053', 'Red'),
                new ChosenAnswer('6044', 'Blue'),
                new ChosenAnswer('6056', 'Yellow'),
                new ChosenAnswer('6048', 'Green'),
                new ChosenAnswer('', ''),
            ], 'color_ids=',
            'Color isn t that important, It looks good tho.'),

        new QuizPart('What brand would you like?', [
                new ChosenAnswer('5805', 'Adidas'),
                new ChosenAnswer('5866', 'Nike'),
                new ChosenAnswer('5875', 'Puma'),
                new ChosenAnswer('', ''),
            ], 'manufacturer_ids=',
            'Brand is less important. Its just your own preference'),
    ]

每次您在 getLink() 中转到一个新问题时，它都会用 & 连接这两个问题。 当您控制台记录 getLink() 时，它看起来像这样：

bd_shoe_size_ids=6595&color_ids=6044&manufacturer_ids=5875,5866

但是，如果您跳过一个问题，它仍然会添加 & 符号。因此，如果跳过第一个问题，则开头有一个 & 符号。如果我跳过第二个，它会在 middel 中添加 2，如下所示：

bd_shoe_size_ids=6595&&manufacturer_ids=5875

如果你跳过最后一个，它会在最后添加。

我尝试使用 replace 将两个 & 符号替换为一个，如果它们位于开头或结尾，则将其删除，但它不起作用。如果字符串中没有值，有人知道不加入他们的好方法吗？

Answer 1

replace 仅适用于字符串中找到的第一个项目。您可以使用replaceAll，或split 和join，这样跨浏览器更友好，如下所示：

function cleanLink(link) {
  let newLink = link.split('&&').join('&'); // remove duplicate ampersands
  if (newLink[0] === '&') {
    newLink = newLink.slice(1); // remove starting ampersand
  }
  if (newLink[newLink.length - 1] === '&') {
    newLink = newLink.slice(0,-1); // remove trailing ampersand
  }
  return newLink;
}