멋쟁이 사자처럼 FE 2기 - 25

임홍렬·2022년 5월 3일
0
post-thumbnail

220503


JavaScript 배열


배열

데이터의 집합. 여러개의 값을 하나의 이름으로 묶어 사용할 수 있게 도와줍니다.
배열의 각 값은 원소(element) 혹은 요소 라고 부릅니다.
배열의 크기는 length 프로퍼티를 통해 알 수 있습니다.
배열의 생성자 함수에 숫자를 한개만 넣으면 인스턴스의 길이를, 여러 숫자를 넣으면 배열의 원소를 뜻합니다.
배열에도 리터럴 표현이 있습니다.(  [  ]  ) 
각괄호 + 인덱스를 통해 각 원소에 접근 할 수 있으며, 원소에 값을 저장 할 수도 있습니다. 심지어 존재하지 않는 원소에도 접근이 가능합니다.
리터럴 생성과 동시에 원소에 접근 할 수도 있습니다. ([1,2,3,][0] === 1)

참조자료형 : 객체를 생성하여 값을 할당하고 그 값을 복제하면 “값 자체”를 복제하는 것이 아니라 그 값이 위치한 ‘주소’를 복사합니다.
객체 자료형을 “참조 자료형”으로 부르는 이유도 이와 같습니다

함수 : 여러차례 반복해야하는 코드 뭉치를 묶어서 하나의 이름으로 표현한것!


pop();

맨 마지막 값을 가져온다

부름을 받았습니다! 어머니께서 마늘, 양파, 배추를 사오라고 하는군요. 집에 왔더니 오늘 필요한 재료는 배추라고 합니다! 어머니에게 배추를 주세요!

var 철수 = ['마늘', '양파', '배추'];
var 엄마 = 철수.pop();
-> 엄마 : '배추'
엄마 = push(철수.pop());
-> 엄마 ['양파']
push() : 배열의 마지막 요소로 인자로 전달한 값을 추가하고 새로운 배열의 길이를 반환한다.

splice();

기존의 요소를 삭제하거나, 교체하거나, 새 요소를 추가합니다. 인덱스, 카운트, 아이템 순서로 인자를 전달합니다.
  • 삭제
  • 추가
  • 삭제 후 추가

var fish = ['정어리', '고등어', '돌고래', '참치', '고래상어', '코끼리'];
        
 // 1. splice 를 이용해 코끼리를 제거해보세요.
       - fish.splice (-1,1);
        
// 2. 참치 다음에 다금바리를 추가해보세요.
		- fish.splice (4,0,'다금바리');
       
// 3. 돌고래를 제거하고 옥돔과 갈치를 추가해보세요.
		- fish.slice (2, 1, '옥돔','갈치')

slice();

두 개의 인자를 전달하여 배열안에 있는 요소를 새로운 배열로 반환합니다. 원본 요소가 바뀌지 않는것이 포인트! 
특히 두 번째 인자에 해당하는 인덱스의 아이템은 포함하지 않습니다.
// 4. var fish = ['정어리', '고등어', '돌고래', '참치', '고래상어', '코끼리'];
        // 다음 배열에서 물고기가 아닌것을 slice로 선택해 콘솔로 출력해 보세요.
     
      - console.log(fish.slice(2,3));
      - fish.slice(3,4);


sort(); : 배열의 요소를 정렬한 후 그 배열을 반환합니다.

vat arrNum = [13, 19, 10, 3, 44, 21];
> arrNum.sort();
->(6) [10, 13, 21, 3, 44, 9]
> arrNum.sort (
	funtion (a, b){
    	return a - b;
        }
);
> (6) {3, 9, 10, 13, 21, 44}

var arrNum2 = [13, 9, 10, 2];
        // 오름차순으로 정렬할 경우 (a - b)
        // 13 - 9 == 4 --> 양수임으로 9를 앞으로
        // 13 - 10 == 3 --> 양수임으로 10을 앞으로
        // 9 - 10 == -1 --> 음수 임으로 9를 앞으로 [9, 10, 13, 2]
        // 13 - 2 == 11 --> 양수임으로 2를 앞으로 [9, 10, 2, 13]
        // 10 - 2 == 8 --> 양수임으로 2를 앞으로 [9, 2, 10, 13]
        // 9 - 2 == 7 --> 양수임으로 2를 앞으로 [2, 9, 10, 13]

 // 다음 배열에서 sort 함수를 이용해 원소의 product의 값을 기준으로 가나다순으로 정렬해보세요.
        var studentList = [
            {
                id: 1, product: '연필', stock: 10
            },
            {
                id: 2, product: '색종이', stock: 33
            },
            {
                id: 3, product: '체육복', stock: 2
            },
            {
                id: 4, product: '만연필', stock: 0
            }
        ]

->만연필->연필->색종이->체육복
-> 
studentList.sort(function (a, b) {
            if (a.product < b.product) {
                return -1;
            } else if (b.product < a.product) {
                return 1;
            } else {
                return 0;
            }
        });
문자열에서 작고 크다는 것은 유니코드의 순서가 앞이냐 뒤냐이다.
한글을 예로 들면 가나다라마바사 사 > 가 -> 결과:true

  • 내가 어떤걸 이런방시으로 해결했어 -연봉협상시 유리

  • 프로젝트참여시 내가 이래이래해서 남들보다 낫다는 것을 증명해야함- 연봉협상시유리

  • 프로젝트 구성원도 잘 살펴보고, 첫 프로젝트가 다음 회사를 정한다.

profile
뜨내기 FE 개발자

0개의 댓글