JS_includes() 정리

👩🏻‍💻 indexOf() 만 알고있다가 .includes()를 새로 알게되었다...
나만 지금 알게된거냐구...ㅎㅎㅎ 알면 알수록 새로운거 투성이다!!!

---

1️⃣ 배열에서 .includes()

✔ 배열에 특정 요소가 있는지 확인할 때 사용

const fruits = ["사과", "바나나", "포도"];

console.log(fruits.includes("바나나")); // true
console.log(fruits.includes("복숭아")); // false

✅ 대소문자를 구분하지 않는다
✅ true 또는 false를 반환
✅ ES6(ECMAScript 2016)부터 사용 가능

---

2️⃣ 문자열에서 .includes()

✔ 문자열 안에 특정 단어가 포함되어 있는지 확인할 때 사용

const text = "JavaScript는 재미있다.";

console.log(text.includes("JavaScript")); // true
console.log(text.includes("Python")); // false

✅ 대소문자를 구분한다 ("Hello"와 "hello"는 다르게 인식됨)
✅ 공백도 포함해서 찾는다
✅ indexOf()보다 가독성이 좋다

---

3️⃣ 두 번째 매개변수 (검색 시작 위치)

✔ .includes(value, startIndex) 형식으로 특정 위치부터 검색할 수 있다

const numbers = [10, 20, 30, 40, 50];

console.log(numbers.includes(20, 2)); // false (2번 인덱스부터 찾음)
console.log(numbers.includes(30, 2)); // true

---

4️⃣ .includes() vs .indexOf()

메서드	반환값	사용법
.includes()	true 또는 false	arr.includes(value)
.indexOf()	찾으면 인덱스 번호, 없으면 -1	arr.indexOf(value) !== -1

💡 존재 여부만 확인할 땐 .includes()가 더 직관적

---

5️⃣ 활용 예시

✔ 배열에서 중복 값 체크

const selectedColors = ["red", "yellow", "green"];
const newColor = "blue";

if (!selectedColors.includes(newColor)) {
  selectedColors.push(newColor);
}

console.log(selectedColors); // ["red", "yellow", "green", "blue"]

✔ 검색 기능 구현

const products = ["아이폰", "갤럭시", "맥북", "아이패드"];

const search = "아이폰";
console.log(products.some((p) => p.includes(search))); // true

---

🔹 정리

✔ .includes()는 배열과 문자열에서 특정 값이 존재하는지 확인하는 메서드
✔ true 또는 false를 반환해 간결하게 조건문에서 활용가능
✔ 검색, 중복 체크, 필터링 등에 유용

---