<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 배열 : 여러개의 데이터들을 하나의 공간에 저장/관리하는 자료형
// - 가변의 길이
// - 자료형 제한X
// 배열 선언하기
// Java : 자료형[] 변수명 = new 자료형[공간크기];
// JS : let 변수명 = [];
let array = []; // 빈 배열 생성
let numList = [1, 2, 3, 4, 5]; // 5개의 데이터를 가진 배열 생성
// 배열에 데이터 추가
array[0] = 1;
array[1] = 2;
array[2] = "hello";
array[3] = true;
array[4] = ["a", "b"];
console.log(array);
console.log(array[0]);
console.log(array[4]);
// push() : 배열의 마지막 위치에 데이터 추가하는 함수
// 데이터를 추가할 때 1개 이상 추가 가능
array.push(5);
array.push(6);
array.push(7, 8, 9);
console.log(array);
// 배열 데이터에 접근하기
// ex) 5번방 데이터 가지고 오기
console.log(array[5]);
// 배열 데이터 삭제 : splice()
// splice(시작인덱스, 삭제할 갯수)
// ex) 0번째방 데이터부터 2개 삭제하기
// -> 0번째, 1번째를 삭제
array.splice(0, 2);
console.log(array);
// includes()
// 배열 내에 데이터가 있는지 확지
// : 데이터가 있으면 T, 없으면 F
console.log("hello라고 하는 데이터가 있을까?", array.includes("hello"));
// indexOf()
// 배열 내에 찾고 싶은 데이터의 위치를 알려주는 함수
// 데이터가 있으면 인덱스 반환 / 없으면 -1 반환
console.log("true의 위치", array.indexOf(true));
// slice()
// 범위에 해당하는 데이터를 잘라내는 함수
// - slice(시작인덱스, 끝인덱스)
// - 끝인덱스는 미포함
// - 잘라낸 데이터들을 배열 반환
console.log(array.slice(0, 5)); // 0 ~ 4 위치에 있는 데이터들을 배열로 반환
</script>
</body>
</html>
예제)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
let fruits = ["apple", "pear", "avocado", "plum", "grapes", "mango",
"yuja", "kiwi", "banana", "orange", "peach",
"lime", "tomato"];
console.log(fruits);
// 1. fruits의 마지막 아이템인 tomato 삭제
fruits.pop();
console.log(fruits);
// 2. grapefruit 추가하기
fruits.push("grapefruit");
console.log(fruits);
// 3. “cherry”, “blackberry” 추가하기
fruits.push("cherry", "blackberry")
console.log(fruits);
// 4. orange가 있는지 확인하기
console.log(fruits.includes("orange"));
// 5. watermelon이 있는지 확인하기
console.log(fruits.includes("watermelon"));
// 6. kiwi를 goldkiwi로 변경
fruits[fruits.indexOf("kiwi")] = "goldkiwi";
console.log(fruits);
// 7. banana부터 3개의 아이템을 기존 배열에서 삭제
fruits.splice(fruits.indexOf("banana"), 3);
console.log();
// 8. grapes 이후의 값을 전부 제거
// 삭제
fruits.splice(fruits.indexOf("grapes")+1, );
// 9. avocado부터 grapes까지 가져와서 새로운 배열에 저장
fruits.slice(fruits.indexOf("avocado"), fruits.indexOf("grapes")+1);
</script>
</body>
</html>'Web > JavaScript' 카테고리의 다른 글
| 함수 (0) | 2023.04.18 |
|---|---|
| 랜덤배열, 점수출력 예제 (0) | 2023.04.17 |
| 랜덤수 (0) | 2023.04.17 |
| 반복문 (0) | 2023.04.17 |
| 조건문 (0) | 2023.04.17 |
댓글