2026년 상식닷컴 선정 식당 & 카페 리스트
최근에 오픈한 호텔을 찾는다면 살펴보세요

자바스크립트에서 String.prototype.includes()의 사용법은 무엇인가요?

_____
Q1: `String.prototype.includes()` 메서드는 무엇인가요?
A1: `includes()`는 문자열 내에 특정 문자열이 포함되어 있는지를 확인하는 자바스크립트 메서드입니다. 포함 여부를 `true` 또는 `false`로 반환합니다.

---

Q2: `includes()` 메서드의 기본 문법은 어떻게 되나요?
A2:
```javascript
str.includes(searchString[, position])
```
- `searchString`: 찾고자 하는 문자열 (필수)
- `position`: 검색을 시작할 문자열의 인덱스 (선택, 기본값은 0)

---

Q3: `includes()`의 반환 값은 무엇인가요?
A3:
- `true`: 문자열 `str`에 `searchString`이 포함된 경우
- `false`: 포함되어 있지 않은 경우

---

Q4: `includes()`는 대소문자를 구분하나요?
A4: 네, `includes()`는 대소문자를 구분합니다. 예를 들어 `"Hello".includes("h")`는 `false`를 반환합니다.

---

Q5: `position` 매개변수는 어떻게 사용하나요?
A5: `position`은 검색을 시작할 인덱스입니다. 예를 들어:
```javascript
let str = 'Hello, world!';
str.includes('world', 7); // true
str.includes('Hello', 1); // false, 1번째 인덱스부터 검색
```

---

Q6: `includes()`는 문자열의 어떤 부분까지 찾을 수 있나요?
A6: 전체 문자열 끝까지 검색하며, 부분 문자열이 문자열 중간이나 끝에 포함되어 있어도 `true`를 반환합니다.

---
Q7: 만약 `searchString`이 빈 문자열이면 어떻게 되나요?
A7: 빈 문자열 `""`을 검색하면 항상 `true`를 반환합니다, 왜냐하면 빈 문자열은 어디에나 포함된 것으로 간주되기 때문입니다.

---

Q8: `includes()`와 `indexOf()`의 차이점은 무엇인가요?
A8:
- `includes()`: 포함 여부를 `true` 또는 `false`로 반환
- `indexOf()`: 존재하면 해당 문자열의 인덱스(숫자)를 반환, 없으면 `-1` 반환
`includes()`는 가독성이 좋은 조건문 작성에 유리합니다.

---

Q9: `includes()`는 ES6에서 도입되었는데, 구형 브라우저 호환 문제는 어떻게 하나요?
A9: 구형 브라우저에서는 `includes()`가 지원되지 않을 수 있으므로, 폴리필을 사용하거나 `indexOf()`로 대체할 수 있습니다.
예:
```javascript
const hasStr = str.indexOf(searchString) !== -1;
```

---

Q10: 예제 코드가 있나요?
A10:
```javascript
let phrase = "The quick brown fox jumps over the lazy dog.";

console.log(phrase.includes("quick")); // true
console.log(phrase.includes("Quick")); // false (대소문자 구분)
console.log(phrase.includes("fox", 16)); // false (16번째 인덱스부터 검색)
console.log(phrase.includes("fox", 10)); // true
console.log(phrase.includes("")); // true (항상 참)
```

---

요약:
- `includes()`는 특정 문자열 포함 여부 확인
- 대소문자 구분
- 검색 시작 인덱스 지정 가능
- 반환 값은 불리언 타입 (true/false)
- ES6 이상 환경에서 사용 권장
`String.prototype.includes()` 메서드는 JavaScript에서 문자열이 특정 문자열을 포함하고 있는지를 확인하는 데 사용되는 매우 유용한 함수입니다.

이 메서드는 ECMAScript 6(ES

6)에서 도입되었으며, 간단하고 직관적인 문법 덕분에 문자열 검색을 쉽게 수행할 수 있습니다.

기본 문법```javascriptstr.includes(searchString[, position])```- str : 검색을 수행할 원본 문자열입니다.

- searchString : 찾고자 하는 문자열입니다.

- position (선택적): 검색을 시작할 위치를 지정하는 정수입니다.

기본값은 0입니다.

반환값`includes()` 메서드는 `true` 또는 `false`를 반환합니다.

문자열이 `searchString`을 포함하면 `true`, 그렇지 않으면 `false`를 반환합니다.

사용 예제1. 기본 사용법 ```javascriptconst str = "Hello, world!";console.log(str.includes("world")); // trueconsole.log(str.includes("hello")); // false (대소문자 구분)```2. 위치 지정하기 ```javascriptconst str = "Hello, world!";console.log(str.includes("world",

7)); // false (7번째 인덱스 이후에는 "world"가 없음)console.log(str.includes("world",

6)); // true (6번째 인덱스부터 검색)```3. 대소문자 구분 `includes()` 메서드는 대소문자를 구분합니다.

따라서 "hello"와 "Hello"는 서로 다른 문자열로 간주됩니다.

```javascriptconst str = "JavaScript is awesome!";console.log(str.includes("Java")); // trueconsole.log(str.includes("java")); // false```4. 빈 문자열 검색 빈 문자열(`""`)은 모든 문자열에 포함되어 있다고 간주되므로, 항상 `true`를 반환합니다.

```javascriptconst str = "Hello, world!";console.log(str.includes("")); // true```5. 문자열의 시작과 끝 확인 `includes()` 메서드는 문자열의 시작 부분이나 끝 부분에 특정 문자열이 있는지 확인하는 데 유용합니다.

```javascriptconst str = "Hello, world!";console.log(str.startsWith("Hello")); // trueconsole.log(str.endsWith("world!")); // true``` 호환성`String.prototype.includes()` 메서드는 대부분의 최신 브라우저에서 지원되지만, 구형 브라우저에서는 지원되지 않을 수 있습니다.

따라서 구형 브라우저와의 호환성을 고려해야 할 경우, 폴리필을 추가하거나 다른 방법을 사용할 수 있습니다.

대안구형 브라우저에서 `includes()` 메서드를 사용할 수 없는 경우, `indexOf()` 메서드를 사용할 수 있습니다.

`indexOf()`는 문자열이 포함되어 있는 경우 해당 인덱스를 반환하고, 포함되어 있지 않으면 `-1`을 반환합니다.

```javascriptconst str = "Hello, world!";console.log(str.indexOf("world") !== -1); // trueconsole.log(str.indexOf("hello") !== -1); // false``` 결론`String.prototype.includes()` 메서드는 문자열이 특정 부분 문자열을 포함하고 있는지를 확인하는 간단하고 효율적인 방법을 제공합니다.

대소문자를 구분하며, 검색 시작 위치를 지정할 수 있는 유연성을 가지고 있습니다.

이 메서드는 문자열 검색을 수행할 때 매우 유용하며, 코드의 가독성을 높여줍니다.

작성자: 정다은 [비회원] | 작성일자: 1년 전 2024-09-08 14:47:28
조회수: 134 | 댓글: 0 | 좋아요: 0 | 싫어요: 0
내용이 부정확하다면 싫어요를 클릭해주세요.