迹忆客 专注技术分享

在 JavaScript 中将全名拆分为名字和姓氏：

1. 对字符串调用 String.split() 方法，按空格拆分。
2. String.split() 将返回一个包含名称的数组。
3. 使用数组解构将名字和姓氏的值分配给变量。

const fullName = 'Adam Jones';

// 👇️ ['Adam', 'Jones']
const [first, last] = fullName.split(' ');

console.log(first); // 👉️ Adam
console.log(last); // 👉️ Jones

我们使用 String.split 方法获取包含名称的数组。

我们在空格上拆分字符串以获取结果数组中名称的值。

我们使用数组解构来分配给同一行上的第一个和最后一个变量。

一种简单的思考方式是，第一个和最后一个变量被分配了第一个和第二个数组元素的值。

或者，我们可以在分配给变量时手动访问数组元素。

const fullName = 'Adam Jones';

// 👇️ ['Adam', 'Jones']
const splitOnSpace = fullName.split(' ');
console.log(splitOnSpace);

const first = splitOnSpace[0];
const last = splitOnSpace[1];

console.log(first); // 👉️ Adam
console.log(last); // 👉️ Jones

我们不使用数组解构，而是通过索引查找分配第一个和最后一个变量。

如果我们存储的全名包含 3 个名字，则概念相同。

下面是拆分包含 3 个名称的全名并将值分配给变量的示例：

const fullName = 'Adam Douglas Jones';

const [first, middle, last] = fullName.split(' ');

console.log(first); // 👉️ Adam
console.log(middle); // 👉️ Douglas
console.log(last); // 👉️ Jones

这是相同的示例，但使用索引查找。

const fullName = 'Adam Douglas Jones';

// 👇️ ['Adam', 'Douglas', 'Jones']
const splitOnSpace = fullName.split(' ');

const first = splitOnSpace[0];
const middle = splitOnSpace[1];
const last = splitOnSpace[2];

console.log(first); // 👉️ Adam
console.log(middle); // 👉️ Douglas
console.log(last); // 👉️ Jones

我们选择哪种方法是个人喜好的问题。 我会继续使用数组解构，因为我发现它更简洁且可读性更强。