簡體   English   中英

使用 JavaScript 拆分名字和姓氏

[英]Split First name and Last name using JavaScript

我有一個名為Paul Steve Panakkal的用戶。 這是一個長名稱,它不適合 div 容器。 那么無論如何使用 JavaScript 或 jQuery 將名字和姓氏從中分離出來嗎?

該名稱是從 PHP 獲取到 JavaScript 中的變量中的。 然后使用 JS 對其進行拆分。

您應該使用String.prototype.split()方法:

'Paul Steve Panakkal'.split(' '); // returns ["Paul", "Steve", "Panakkal"]

你可以這樣使用它:

'Paul Steve Panakkal'.split(' ').slice(0, -1).join(' '); // returns "Paul Steve"
'Paul Steve Panakkal'.split(' ').slice(-1).join(' '); // returns "Panakkal"

所以共同點:

var firstName = fullName.split(' ').slice(0, -1).join(' ');
var lastName = fullName.split(' ').slice(-1).join(' ');

是的:

var fullName = "Paul Steve Panakkal".split(' '),
    firstName = fullName[0],
    lastName = fullName[fullName.length - 1];

參考:

在西班牙語中,這可能很棘手,因為您可能有第二個可選名稱,甚至是復雜的姓氏,如“del Bosque”或“de la Hoya”、帶有重音符號的元音和ñ 以下 javascript 能夠解析完整的西班牙名稱,因為您在編寫它時會考慮大寫和小寫。 它會返回一個json給你

  1. name : 1 或 2 個主要名稱
  2. lastName : 主要姓氏
  3. secondLastName :第二個姓氏

代碼是:

function parseName(input) {
        var fullName = input || "";
        var result = {};

        if (fullName.length > 0) {
            var nameTokens = fullName.match(/[A-ZÁ-ÚÑÜ][a-zá-úñü]+|([aeodlsz]+\s+)+[A-ZÁ-ÚÑÜ][a-zá-úñü]+/g) || [];

            if (nameTokens.length > 3) {
                result.name = nameTokens.slice(0, 2).join(' ');
            } else {
                result.name = nameTokens.slice(0, 1).join(' ');
            }

            if (nameTokens.length > 2) {
                result.lastName = nameTokens.slice(-2, -1).join(' ');
                result.secondLastName = nameTokens.slice(-1).join(' ');
            } else {
                result.lastName = nameTokens.slice(-1).join(' ');
                result.secondLastName = "";
            }
        }

        return result;
}

如果您要指定第二個名字,則姓氏是必需的。 試試看:

  • 維森特·埃爾南德斯飛機
  • 奧斯卡·德拉霍亞
  • 何塞·朱利安·馬蒂·佩雷斯
  • 曼努埃爾·德·塞斯佩德斯·德爾·卡斯蒂略
  • 卡利斯托·加西亞·伊尼格斯

甚至嘗試一個復雜的,比如

  • María de la Caridad del Bosque y Loynáz

評論你的經歷。

我認為,是時候開始使用正則表達式了 :)

"Paul Steve Panakkal".split(/(\s).+\s/).join("") // "Paul Panakkal"

最常見的解決方案,我們總是將第一個單詞作為名字,其余的作為姓氏:

 const splitName = (name = '') => { const [firstName, ...lastName] = name.split(' ').filter(Boolean); return { firstName: firstName, lastName: lastName.join(' ') } } console.log(splitName('Jon Snow')); console.log(splitName(' Jon ')); console.log(splitName(' Jon The White Wolf '));

Speransky Danil 的答案的擴展版本,它處理提供的字符串中只有一個單詞的情況。

/**
 * Gets the first name, technically gets all words leading up to the last
 * Example: "Blake Robertson" --> "Blake"
 * Example: "Blake Andrew Robertson" --> "Blake Andrew"
 * Example: "Blake" --> "Blake"
 * @param str
 * @returns {*}
 */
exports.getFirstName = function(str) {
    var arr = str.split(' ');
    if( arr.length === 1 ) {
        return arr[0];
    }
    return arr.slice(0, -1).join(' '); // returns "Paul Steve"
}

/**
 * Gets the last name (e.g. the last word in the supplied string)
 * Example: "Blake Robertson" --> "Robertson"
 * Example: "Blake Andrew Robertson" --> "Robertson"
 * Example: "Blake" --> "<None>"
 * @param str
 * @param {string} [ifNone] optional default value if there is not last name, defaults to "<None>"
 * @returns {string}
 */
exports.getLastName = function(str, ifNone) {
    var arr = str.split(' ');
    if(arr.length === 1) {
        return ifNone || "<None>";
    }
    return arr.slice(-1).join(' ');
}

我嘗試了下面的代碼,它對我來說很酷

var full_name = 'xyz abc pqr';
var name = full_name.split(' ');
var first_name = name[0];
var last_name = full_name.substring(name[0].length.trim());

在上面的例子中:

(1)

If full_name = 'xyz abc pqr';
first_name = "xyz";
last_name = "abc pqr";

(2)

If `full_name = "abc"`:
Then first_name = "abc";
and last_name = "";

一位評論者說如果想要名字是“保羅”而姓氏是“史蒂夫·帕納卡爾”怎么辦?

 var name = "Paul Steve Panakkal" // try "Paul", "Paul Steve" var first_name = name.split(' ')[0] var last_name = name.substring(first_name.length).trim() console.log(first_name) console.log(last_name)

如果您假設最后一個單詞是姓氏並且單個單詞名稱也是姓氏,那么...

var items = theName.split(' '),
    lastName = items[items.length-1],
    firstName = "";

for (var i = 0; i < items.length - 1; i++) {
   if (i > 0) {
      firstName += ' ';
   }
   firstName += items[i];
}

注意邊緣情況,例如僅提供名字或輸入兩個或多個空格。 如果您只想解析名字和姓氏,這將解決問題(全名應始終包含至少 1 個字符以避免將 first_name 設置為空字符串):

var full_name_split = "Paul Steve Panakkal".split(" ");
var first_name = full_name_split[0];
var last_name = full_name_split.length > 1 ? full_name_split[full_name_split.length - 1] : null;

有很多方法可以存檔這個。

我認為最簡單的方法是拆分並彈出姓氏。

 let fullname = 'Paul Steve Panakkal'; // from php let tmpArray = fullname.split(' '); //split the name to an array const lastname = tmpArray.pop(); // pop the last element of the aray and store it in "lastname" variable const firstname = tmpArray.join(' '); // join the array to make first and middlename and store it in "firstname" variale console.log("firstname:", firstname) console.log("lastname:", lastname)

使用此代碼:

您需要更改行: splitFullName("firstName","lastName","fullName"); 並確保它包含表單中正確的字段 ID。


function splitFullName(a,b,c){
    String.prototype.capitalize = function(){
        return this.replace( /(^|\s)([a-z])/g , function(m,p1,p2){ return p1+p2.toUpperCase(); } );
    };
    document.getElementById(c).oninput=function(){
        fullName = document.getElementById(c).value;
        if((fullName.match(/ /g) || []).length ===0 || fullName.substring(fullName.indexOf(" ")+1,fullName.length) === ""){
            first = fullName.capitalize();;
            last = "null";
        }else if(fullName.substring(0,fullName.indexOf(" ")).indexOf(".")>-1){
            first = fullName.substring(0,fullName.indexOf(" ")).capitalize() + " " + fullName.substring(fullName.indexOf(" ")+1,fullName.length).substring(0,fullName.substring(fullName.indexOf(" ")+1,fullName.length).indexOf(" ")).capitalize();
            last = fullName.substring(first.length +1,fullName.length).capitalize();
        }else{
            first = fullName.substring(0,fullName.indexOf(" ")).capitalize();
            last = fullName.substring(fullName.indexOf(" ")+1,fullName.length).capitalize();
        }
        document.getElementById(a).value = first;
        document.getElementById(b).value = last;
    };
    //Initial Values
    if(document.getElementById(c).value.length === 0){
        first = document.getElementById(a).value.capitalize();
        last = document.getElementById(b).value.capitalize();
        fullName =  first + " " + last ;
        console.log(fullName);
        document.getElementById(c).value = fullName;
    }
}

//Replace the ID's below with your form's field ID's
splitFullName("firstName","lastName","fullName");

來源:http: //developers.marketo.com/blog/add-a-full-name-field-to-a-marketo-form/

您無需使用任何拆分方法並為該操作創建不必要的數組。 只需使用 javascript 的lastIndexOfsubstring方法。

var s = "Paul Steve Panakkal";
var a = s.lastIndexOf(' '); // last occurence of space
var b = s.substring(0, a); // Paul Steve
var c = s.substring(a+1); // Panakkal

 const fullName = 'Paul Steve Panakkal'.split(' '); const lastName = fullName.pop(); // 'Panakkal' const firstName = fullName.join(' '); // 'Paul Steve' console.log(firstName); console.log(lastName);

使用以下代碼,它適用於我

 let name = "Paul Steve Panakkal" let parts = name.split(' ') let firstName = parts.shift(); // Paul let lastName = parts.join(' '); // Steve Panakkal console.log({ firstName, lastName })

var firstName = fullName.split(" ")[0];

另一種選擇可能是使用正則表達式。

\w+\s\w+(?=\s)|\w+

上面的正則表達式將找到匹配兩個或三個命名類型組合的firstNamelastName字符串模式。

 const regex = /\w+\s\w+(?=\s)|\w+/g; const name1 = 'Paul Steve Panakkal'; const [firstName1, lastName1] = name1.trim().match(regex); console.log(`${firstName1} | ${lastName1}`); const name2 = 'John Doe'; const [firstName2, lastName2] = name2.trim().match(regex); console.log(`${firstName2} | ${lastName2}`);

細節

  • \w+匹配任何單詞字符。
  • ?=\s匹配任何空白字符但不捕捉它。

如果您的意思是姓氏是名字之后的所有名字,只需使用:

var name = "Paul Steve Panakkal";
var arrName = name.split(" ");
var firstName = arrName.slice(0, 1).join(' ');
var lastName = arrName.slice(1, arrName.length).join(' ');

這樣,firstName 和 lastName 總是正確的

var names = fullName.split(' ');
if (!names || names.length <= 1) {
   firstName = this.name;
   lastName = '';
} else {
   firstName = names.slice(0, -1).join(' ');
   lastName = names.slice(-1).join(' ');
}
var fullName = "Paul Steve Panakkal";

您可以使用 split 函數拆分全名,然后拆分結果,例如在數組或列表中顯示元素。

這就是您使用 split 功能時發生的情況。

fullName.split(" ")

["Paul", "Steve", "Panakkal"]

這不會保存到任何變量中。 您可以執行拆分功能並將元素分配給這樣定義明確的變量。

var firstName = fullName.split(" ")[0];

var lastName = fullName.split(" ")[1];

var otherName = fullName.split(" ")[2];

我想出了這個邏輯:

const fullName = "Paul Steve Panakkal";
const idx = fullName.lastIndexOf(' ');
const firstName = idx !== -1 ? fullName.substring(0, idx) : fullName;
const lastName = idx !== -1 ? fullName.substring(idx + 1) : '';
console.log('firstName:', firstName, 'lastName:', lastName);

輸出:

firstName: Paul Steve lastName: Panakkal
"  Paul Steve   ".trim().split(/(\s).+\s/).join("")  // 'Paul Steve'

您應該添加trim()以防用戶不小心輸入了額外的空格!

如果您希望姓氏是名字之后的所有名字:

function splitFirstLast(name) {
  return {
    firstName: name.indexOf(' ') !== -1 && name.substring(0, name.indexOf(' ')) || name,
    lastName: name.indexOf(' ') !== -1 && name.substring(name.indexOf(' ') + 1) || ''
  }
}

對象可以通過一個簡單的函數來解決問題:

 const fullName = "Edgar Allan Poe" const formatter = (name) => { const splitedName = name.trim().split(' ') if(splitedName.length === 0) return "" //here happens the hack!, it prevents duplicate names //JS objects overrides duplicate keys, very useful here const output = { [splitedName[0]]: splitedName[0], //storing first key [splitedName[splitedName.length - 1]]: splitedName[splitedName.length - 1] //storing last key (whose may be first key) } return Object.keys(output).join(' ').trim() //now convert object keys into a string. "E pronto rs" } console.log(formatter(fullName)) // "Edgar Poe" console.log(formatter("Elias")) // "Elias" console.log(formatter("")) // ""

此函數會將任何名稱分解為名字和姓氏,將最后一個單詞存儲為姓氏,將其他所有內容存儲為名字。 它返回一個包含分隔名稱的對象:

 function parseName(fullName) { const name = fullName.split(' ') const person = {} if (name.length > 1) { person.lastName = name.pop() person.firstName = name.join(' ') } else { person.lastName = "" person.firstName = obj.name } return person } console.log(parseName("Ashak Zahin Hasan")) // { firstName: "Ashak Zahin", lastName: "Hasan" }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM