JavaScript

JavaScript 배열&객체

커피마시기 2023. 11. 9. 00:23

 

 

 

■ 배열

 

 

 

● 배열 생성하기

배열은 대괄호 [] 또는 new Array를 사용하여 생성한다

        let players = ["손흥민", "이강인", "김민재", "황희찬"];
        let num = [1,2,3,4,5];
        let item = new Array("컴퓨터","노트북","아이패드");

 

 

 

 

 

 

 

 

● 배열의 요소 접근

배열 내의 요소는 0부터 시작하는 인덱스를 사용하여 해당 인덱스의 값을 가져온다

        let players = ["손흥민", "이강인", "김민재", "황희찬"];
        let num = [1,2,3,4,5];
        let item = new Array("컴퓨터","노트북","아이패드");

        console.log(players[2]);
        console.log(num[0]);
        console.log(item[1]);

 

 

 

 

 

 

 

 

● 배열의 요소 추가 및 제거

push() 메소드를 사용하여 배열 마지막 인덱스 뒤에 요소를 추가할 수 있다.

pop() 메소드를 사용하여 배열의 마지막 요소를 제거할 수 있다.

splice() 메소드를 사용하여 해당 인덱스를 포함한 기준으로 요소를 제거할 수 있다.

        let players = ["손흥민", "이강인", "김민재", "황희찬"];
        players.push("조규성","정우영");
        console.log(players); // ["손흥민", "이강인", "김민재", "황희찬","조규성","정우영"]

        players.pop();
        console.log(players); // ["손흥민", "이강인", "김민재", "황희찬","조규성"]

        players.splice(1,3);
        console.log(players); // ["손흥민","조규성"]

 

 

 

 

 

 

 

  배열 순회

forEach(), for() 등을 사용하여 배열을 순회 할 수 있다.

        let players = ["손흥민", "이강인", "김민재", "황희찬"];
        players.push("조규성");
        
        // forEach 사용
        players.forEach(p => {
            console.log(p);
        })

        // 일반적인 for문 사용
        for(let i = 0; i < players.length; i++) {
            console.log(players[i]);
        }

 

 

 

 

 

 

 

  배열 해당 요소 검색

indexof()는 배열에서 해당 요소에 해당하는 처음 인덱스를 리턴한다.

includes()는 해당 요소가 배열에 포함되어 있으면 true, 없으면 false를 리턴한다.

        let players = ["손흥민", "이강인", "김민재", "황희찬"];
        console.log(players.indexOf("이강인")); // 1

        console.log(players.includes("김민재")); // true
        console.log(players.includes("박지성")); // false

 

 

 

 

 

 


 

 

 

 

 

 객체

 

 

● 객체 선언

Javascript의 객체는 key와 value로 구성되어 있다.

        let users = {
            userName : "이천수",
            userPwd : "1q2w",
            userEmail : "1q2w@mail.com"
        };
        
        let info = [
            {
                name : "이상한",
                age : 23
            },
            {
                name : "엘리스",
                age : 24
            }
        ];

        info.forEach( u => {
            console.log(u); // name: '이상한', age: 23 , name: '엘리스', age: 24
        });

        player = new Object();

        player.name = "박지성";
        player.position = "MF";

        console.log(users); // userName: '이천수', userPwd: '1q2w', userEmail: '1q2w@mail.com'
        console.log(player); // name: '박지성', position: 'MF'

 

 

 

 

 

 

 

● 객체 for in

for in을 사용하여 해당 key값 value값을 가져온다

        let users = {
            userName : "이천수",
            userPwd : "1q2w",
            userEmail : "1q2w@mail.com"
        };
        
        for(key in users) {
            console.log(key); // key 값
            console.log(users[key]); // value 값
        }

 

 

 

 

 

 

Object.keys  & Object.values & Object.entries

Object.keys는 key 값을 담은 배열을 반환한다. Object.values는 value 값을 담은 배열을 반환한다

Object.entries는 key,value 를 쌍으로 담은 배열을 반환한다.

        let users = {
            userName : "이상해씨",
            userPwd : "qweasd11",
            userEmail : "3e4r@gmail.com",
            userAge : 26
        };
        console.log(Object.keys(users)); // ['userName', 'userPwd', 'userEmail', 'userAge']
        console.log(Object.values(users)); // ['이상해씨', 'qweasd11', '3e4r@gmail.com', 26]
        console.log(Object.entries(users)); // 0 : ['userName', '이상해씨']   1 : ['userPwd', 'qweasd11'] ....
        
        for(let i = 0; i < Object.keys(users).length; i++) {
            console.log(Object.keys(users)[i]); 
        }

        for(let i = 0; i < Object.values(users).length; i++) {
            console.log(Object.values(users)[i]); 
        }

 

 

 

 

 

 

 


 

 

 

 

Today short review 

틀린부분이나 잘못 알고 있는 부분이 있다면 알려주시면 감사하겠습니다~!

'JavaScript' 카테고리의 다른 글

JavaScript -1  (0) 2023.11.02