时间戳

首页 > 解决方案 > 将名字和姓氏翻转为姓氏名字

javascript - 将名字和姓氏翻转为姓氏名字

问题描述

我正在尝试从 textarea 交换名字和姓氏

输入： John Doe

简·多伊

乔·多伊

琼·多伊

珍妮·范·多伊

期望的输出： Doe，John

能源部，简

能源部，乔

多伊，琼

范多伊，珍妮

但得到： Doe Jane Doe Joe Doe Joan Doe Jenny van Doe, John

逻辑很简单，将第一个字符串作为名字，其余作为姓氏，如果有中间名，它也将作为姓氏，用逗号分隔。

它正在使用此代码，但仅适用于一个班轮。因此，如果它是来自 textarea 的列表名称，它将把第一个字符串作为名字并将其余的名称分配给姓氏。

var splitName = document.getElementById("splitName");
splitName.onclick = function() {

  var fullname = document.getElementById("fullName").value;
  console.log(fullname);

  var spaceIndex = fullname.indexOf(" ");
  var firstname;
  var lastname;

  if (spaceIndex == -1) {
    lastname = fullname;
    lastname = "";
  } else {

    var firstname = fullname.substring(0, spaceIndex);
    var lastname = fullname.substr(spaceIndex + 1);
  }

  document.getElementById("result").innerHTML = lastname + ", " + firstname;


};
<div>
  <textarea cols="20" rows="5" id="fullName"></textarea>
</div>

<div id="splitName" class="hwbutton">Reverse</div>

<div id="result"></div>

标签： javascriptstringsplitreverseswap

解决方案

我就是这样做的。

const rearrangeName = (name) => {
  // convert name string into array, split by spaces
  name = name.split(' ')

  // get first name
  const firstName = name[0]

  // reconnect the rest of the name by spaces
  // trim is just to remove trailing spaces
  const restOfName = name.slice(1).join(' ').trim()

  // return rearranged name, separated by comma
  return restOfName + ', ' + firstName
}

// Above is the main function. This following is just if you want to do 
// something with the DOM.
const textArea = document.querySelector('textarea')
const button = document.querySelector('button')
const output = document.querySelector('.output')

button.addEventListener('click', e => {
  // two \n's because that's how they're separated in textarea
  const values = textArea.value.split(/\n\n/g)
  
  // I'm just clearing out the old values if the user wants to try again.
  output.innerHTML = ''

  for (let i = 0; i < values.length; i++) {
    output.innerHTML += rearrangeName(values[i]) + '<br>'
  }
})
<textarea>
John Doe

Jane Doe

Joe Doe

Joan Doe

Jenny van Doe
</textarea>

<button>Print formatted name to output</button>

<div class="output"></div>

推荐阅读