[실전 자바스크립트]7. object타입, Array

18861 단어 javascirptjavascirpt

자바스크립트에서의 객체

//{}를 이용한 객체새성
const obj = {
	age: 21,
  	name: 'mike',
};
// new Object를 위한 객체생성
const obj2 = new Ojbect({
	age : 21,
  	name : 'mike',
});

// 생성자를 통해 제공되어지는 함수 활용
console.log(Object.keys(obj));
console.log(Ojbect.values(obj));
console.log(Ojbect.entries(obj));

// [] : destructuring 문법
for (const [key, value] of Object.entries(obj)){
	console.log(key, value);
}

object의 속성 추가 삭제 수정

const obj = {
	age: 21,
  	name: 'mike',
};
obj.city = 'seoul'; //새로운 속성의 추가
obj.age = 30; //기존 속성의 value값을 변경
console.log(obj);

delete obj.city; // 특정 키워드 속성을 삭제
console.log(obj);

delete obj['name']; // name 키워드 삭제
console.log(obj);

Array

array기본

const arr = [1, 2, 3];
const arr2 = new Array(1, 2, 3);
console.log(typeof arr === 'object'); //중요! : array의 타입은 object임을 알고 있자.
console.log(Object.values(arr)); // 따라서 이렇게 object생성자의 제공함수를 사용할 수가 있다.

//array에서 사용 할 수 있는 유용한 메서드가 많이 있다.
console.log(arr.map(item => item + 1)); // item에 +1 을 하여 반환한다. 기존의 값은 건드리지 않는다.
console.log(arr.filter(item => item >= 2)); // 오른쪽 조건을 만족하는 아이템만 "새로운 배열"로 만들어 준다.
console.log(arr.reduce((acc, item) => acc + item, 0)); // reduce는 오른쪽 값에서 시작하여, 모든 item에 대해서 지정한 연산을 하여 최종적인 반환을 해준다. acc에서는 누적되어지는 값이 지속적으로 들어오게 된다.

array에서 루프도는 방법들

const arr = [1, 2, 3];

arr.forEach(item => console.log(item));
for (const item of arr) {
	console.log(item);
}

console.log(arr.some(item => item === 2)); //하나이상의 아이템이 우측조건을 만족
console.log(arr.every(item => item === 2)); //모든아이템이 우측조건을 만족
console.log(arr.includes(2)); //2를 포함하는지
console.log(arr.find(item => item % 2 === 1)); //우측조건에 만족하는 "첫번째"값을 반환
console.log(arr.findIndex(item => item % 2 === 1)); //우측 조건에 맞는 첫번째값의 인덱스 값을 반환

배열아이템의 추가와 삭제

const arr = [1,2,3];

// push와 pop을 이용하여 배열을 스택처럼 쓰기
arr.push(4);
console.log(arr.pop());
console.log(arr);

// 아이템을 삭제하고 추가하는 것을 동시에 할 수 있는 splice
arr.splice(1, 1); // 첫번째는 인덱스 두번째는 삭제할 개수
console.log(arr);
arr.splice(1, 0, 10, 20, 30); // 세번째 부터는 추가할 어레이를 지정함
console.log(arr);
arr.splice(1, 3, 40, 50); // 기존아이테메서 3개를 삭제하고 40과 50을 추가한다
console.log(arr);

arr.sort(); //정렬하기(기본 : 오름차순) 그리고 기존배열을 수정
console.log(arr);
arr.sort((a,b) => (a % 10) - ( b % 10)); //정렬조건 수정을 위해서 매개변수를 입력 할 수 있다. 1의 자리숫자를 통해서 비교하여 정렬 조건을 바꾸는 코드
console.log(arr); 

좋은 웹페이지 즐겨찾기