javascript - 使用 .split() 和 .filter() 方法从数组字符串中删除单词

Question

我正在尝试构建一个小型应用程序，允许用户将字符串输入数组，将字符串拆分为单独的数组项，然后(在单独的字段中)输入要过滤的字符串中的特定单词.当前设置允许用户输入一个长字符串，例如“这是一个新字符串”，而单击“添加字符串”会导致字符串被拆分(“this,is,a,new,string”)。然而，在将这些词之一输入过滤字段(例如“new”)后，过滤函数似乎仍返回输入后拆分数组，而没有过滤掉所需的词。关于如何解决这个问题以便过滤从原始字符串中选择的输入单词的任何想法？谢谢!

JS:

var array = [];

function addStr() {
  var str = document.getElementById("newInput").value;
  var addArray = str.split(" ");
  array.push(addArray);
  document.getElementById("main").append(addArray);
  document.getElementById("newInput").value = "";
}

function addFilterWord() {
  var newText = document.getElementById("wordFilter").value;
  array.push(newText);
  document.getElementById("filter").append(newText);
  document.getElementById("wordFilter").value = "";
  const arrayUpdate = array.filter(param => {
  return param != newText;
});

document.getElementById("final").append(arrayUpdate);
}

HTML:

<input id="newInput">
<button onclick="addStr()">Add String</button>

<input id="wordFilter">
<button onclick="addFilterWord()">Filter Word</button>

<p id="main"></p>
<p id="filter"></p>
<p id="final"></p>

Answer 1

当你将一个数组压入另一个数组时，你最终得到一个只有一个元素的数组，这就是你压入的数组。例如:

let str  = "this is a new string"
let array = []
var addArray = str.split(" ");
array.push(addArray);

// array has one element
console.log("length:", array.length)
console.log(array)

您可以改为将一个数组散布到另一个数组中:

let str  = "this is a new string"
let array = []
var addArray = str.split(" ");
array.push(...addArray);
// now array has all the elments on the first level
console.log("length:", array.length)
console.log(array)

还有其他选项是展开运算符是不可能的(就像旧浏览器一样)。您可以使用 concat()但随后您将创建一个新数组，因此您需要更改一些内容。