JavaScript의 String endsWith() 메소드

문자열이 무언가로 끝나는지 알아야 합니까? 간단합니다. #ES6 "endsWith"메소드를 사용하세요. 개발자가 아니어도 무슨 일이 일어나고 있는지 짐작할 수 있습니다. 사람이 읽을 수 있는 언어를 만드는 것이 확실히 갈 길입니다 💪

const workout = '🏃 🏋️ 💪';

// Old Way
workout.indexOf('💪', workout.length - '💪'.length) !== -1;
// true

// ✅ES6 Way
workout.endsWith('💪');
// true

매개변수

endsWith 메서드는 2개의 매개변수를 허용합니다.

검색값

길이

1. 검색 가치

이것은 필수 필드입니다. 여기에서 검색 값을 전달합니다. 단일 문자 이상이 될 수 있습니다. 몇 가지 예를 보자

단일 문자

const name = 'Samantha Ming';

name.endsWith('g'); // true
name.endsWith('n'); // false

여러 문자

const name = 'Samantha Ming';

name.endsWith('ing'); // true
name.endsWith('in'); // false

여러 단어

const name = 'Samantha Ming';

name.endsWith('tha Ming'); // true
name.endsWith('tha M'); // false

2. 길이

여기에서 검색하려는 문자열의 길이를 지정할 수 있습니다. 처음 이것을 읽었을 때 나는 상당히 혼란스러웠다. 길이가 여기서 무엇을 하는지 이해해 봅시다.

먼저 제 이름의 길이를 알려드리고 싶습니다.

console.log('Samantha'.length); // 8
// The last character is 'a'

이제 길이 매개변수를 활용해 보겠습니다.

const name = 'Samantha Ming';

name.endsWith('a', 8); // true

☝️그래서 내가 8라고 말하면 endsWith에게 name 문자열의 첫 번째 "8"문자를 가져오라고 말하는 것입니다(왼쪽에서 오른쪽으로). 이 경우 문자열의 처음 8자입니다. 그리고 그것은 우리가 endsWith 로 검색하는 문자열이 될 것입니다.

위의 예는 다음과 유사합니다.

const name = 'Samantha';

name.endsWith('a'); // true

제가 처음에 혼란스럽다고 말한 이유는 startsWith 에 대한 지식을 끌어왔기 때문입니다. 여기서 두 번째 매개변수는 시작 인덱스입니다. 그래서 나는 endsWith가 있는 두 번째 매개변수가 같은 패턴을 따를 것이고 그것은 역 종료 인덱스가 될 것이라고 가정했습니다 😅 그것이 사람들이 항상 "가정"하지 말라고 말하는 이유입니다. 안다고 생각할 때 실제로는 그렇지 않습니다. 그러니 겸손하고 항상 학생 마음가짐을 유지하세요 🤓

관심이 있으시면 다음은 startsWith에 대한 내 코드 노트입니다.

Code Notes: startsWith

대소문자 구분

다음은 startsWith와 유사한 지식입니다. endsWith 메소드도 대소문자를 구분합니다.

const name = 'Samantha Ming';

name.endsWith('G'); // false
name.endsWith('g'); // true

브라우저 지원

브라우저 지원은 훌륭합니다! Internet Explorer를 제외하면 😅 (죄송합니다. 큰 충격은 없을 것입니다 😂)

Browser Support: endsWith

그러나 여기서 폴리필은 문제가 되지 않으므로 안전하게 사용할 수 있고endsWith 여전히 IE에서 지원됩니다.

MDN Polyfill: endsWith

그건 그렇고, Polyfill이 무엇인지 조금 헷갈린다면. 다음은 Tyler McGinnis의 정말 좋은 비디오입니다.

Compiling vs Polyfills with Babel (JavaScript)

커뮤니티 입력

💬 당신이 알고 있는 다른 오래된 방법은 무엇입니까?

정규식 사용

: 나는 약간의 정규식을 뿌린 카레 헬퍼 함수로 예전 방식을 옹호할 수 있습니다.

const startsWith = pattern => string =>
  new RegExp(`^${pattern}.*`).test(string);

const endsWith = pattern => string => new RegExp(`.*${pattern}$`).test(string);

const sports = "🏈🎳⛳⛸";
console.log(startsWith("🏈")(sports)); // true
console.log(startsWith("⛸")(sports)); // false

console.log(endsWith("🏈")(sports)); // false
console.log(endsWith("⛸")(sports)); // true

: 또는 필요할 때마다 인라인할 수 있는 약간 더 짧은 버전:

const sports = "🏈🎳⛳⛸";

// startsWith
console.log(/^🎳.*/.test(sports)); // false
console.log(/^🏈.*/.test(sports)); // true

// endsWith
console.log(/.*🎳$/.test(sports)); // false
console.log(/.*⛸$/.test(sports)); // true

사용 slice
: 또 다른 - 약간 복잡하고 아마도 더 이론적인 - 방법은 문자열의 일부를 비교하는 것입니다.

const sports = "⛳🎳🏈⚽🎾";
const startPattern = "⛳";
const endPattern = "⚽🎾";

//startsWith
console.log(sports.slice(0, startPattern.length) === "wrong!"); // false
console.log(sports.slice(0, startPattern.length) === startPattern); // true

// endsWith
console.log(sports.slice(-endPattern.length) === "wrong!"); // false
console.log(sports.slice(-endPattern.length) === endPattern); // true

사용 lastIndexOf

const workout = '🏃 🏋️ 💪';

workout.lastIndexOf('💪') === workout.length - '💪'.length;
// true

자원

MDN Web Docs: endsWith

Stack Overflow: endsWith in JavaScript

Check if string starts with or ends with a given string with JavaScript

String startswith, endswith and contains Implementation

Two ways to confirm the ending of a String in JavaScript

읽어주셔서 감사합니다 ❤
안녕하세요! | | Facebook | Blog | SamanthaMing.com