[JavaScript] 7. 배열의 개념과 사용 방법

2024년 07월 19일

Song hyun
작성자
2024.07.19.:19

728x90

[JavaScript] 7. 배열의 개념과 사용

1. 배열의 개념

2. 배열의 사용 방법

(1) new 키워드와 생성자 사용학

(2) 배열 리터럴 사용하기 ([])

3. 예제 코드

(1) new 키워드와 생성자 사용하기

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <H2>INDEX6.HTML 파일입니다.</H2>
    <SCRIPT>

        // 배열을 사용하는 방법 2가지를 살펴보자.

        // 배열을 선언할 때, new 키워드와 생성자를 사용해 배열을 생성할 수 있다.
        const numbers = new Array(1, 2, 3, 4, 5);

        Object.freeze(numbers);
        console.log(numbers[0]);
        numbers[0]=10000;
        console.log(numbers[0]);

    </SCRIPT>
</body>
</html>

(2) 배열 리터럴 사용하기

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <H2>INDEX6.HTML 파일입니다.</H2>
    <SCRIPT>

        // 배열을 사용하는 방법 2가지를 살펴보자.

        // 배열을 선언할 때, new 키워드와 생성자를 사용해 배열을 생성할 수 있다.
        const numbers = new Array(1, 2, 3, 4, 5);

        Object.freeze(numbers);
        console.log(numbers[0]);
        numbers[0]=10000;
        console.log(numbers[0]);

        // 배열 리터럴 : 대괄호[] 를 사용하여 배열을 생성할 수 있다.
        const fruits=['apple','banana','cherry']
        // 배열 요소에 적용하기
        console.log(fruit[0]);
        console.log(fruit[1]);
        console.log(fruit[2]);

        // 배열의 길이 확인 하기
        console.log(fruits.length);

        // 배열에 요소 추가하기 - push() 메서드를 사용하여 배열의 끝에 요소를 추가할 수 있다.
        fruits.push('peach');
        console.log(fruits);
        console.log("--------------");
        // 배열에 요소를 제거하기 - pop() 메서드를 사용하여 배열의 끝에 요소를 삭제할 수 있다.
        fruits.pop();
        console.log(fruits);

        // 배열의 요소를 순회
        for(let i=0; i<numbers.length; i++){
            console.log(numbers[i]);
        }

        console.log("-----------");
        numbers.forEach(function(){
            console.log(num);
        });

    </SCRIPT>
</body>
</html>

728x90

'HTML,CSS, JS > JavaScript' 카테고리의 다른 글

[JavaScript] 9. DOM(Document Object Model) (0)	2024.07.22
[JavaScript] 8. 함수의 개념과 활용 (0)	2024.07.19
[JavaScript] 6. 객체의 종류와 생성 방법 (0)	2024.07.19
[JavaScript] 5. ES6와 let (0)	2024.07.18
[JavaScript] 4. var 키워드와 호이스팅에 대한 이해 (0)	2024.07.18

다음 글이 없습니다.

이전 글이 없습니다.

'HTML,CSS, JS > JavaScript' 카테고리의 다른 글

티스토리툴바