[JS] 변수 & 배열 & 객체

in JavaScript




변수

  • let : 재선언 X🙅🏻‍♀️ 재할당O🙆🏻‍♀️
  • const : 재선언 X🙅🏻‍♀️ 재할당X 🙅🏻‍♀️
  • var : 재선언O🙆🏻‍♀️ 재할당O🙆🏻‍♀️

문자연산

  1. 더하기만 가능
  2. 다른 연산 시도시 NaN반환

숫자연산

  1. 모든 연산이 가능
  2. 문자와 혼합연산시 NaN반환(더하기 제외)

배열

배열을 다루는 여러 내장메소드들이 있는데, 자주 쓰는 몇가지 정리

push() : 배열 마지막에 값 추가

let names = ['sora', 'frank', 'chandler'];
let answer = names.push('monica');

console.log(names)	//['sora', 'frank','chandler','monica']



pop() : 배열 마지막 값 삭제

let names = ['sora', 'frank', 'chandler'];
answer = names.pop();

console.log(names)	//['sora', 'frank']



indexOf() : 해당 값이 몇번째 인덱스에 있는지 리턴. 없으면 -1리턴

let names = ['sora', 'frank', 'chandler'];
let answer = names.indexOf('chandler');

console.log(answer)	//2



includes() : 데이터가 배열안에 존재하는지 확인

let names = ['sora', 'frank', 'chandler'];
let answer = names.includes('sora');

console.log(answer)	//true



join() : 배열을 합쳐서 하나의 문자열로 만듦

let names = ['sora', 'loves', 'chandler'];
let answer = names.join(' ');
console.log(answer)	//sora loves chandler

answer = name.join('');	//soraloveschandler
answer = name.join();	//sora,loves,chandler
answer = name.join('-');	//sora-loves-chandler



unshift() : 배열의 맨 앞에 값 추가

let names = ['loves', 'chandler'];
let answer = names.unshift('sora');

console.log(answer) //['sora', 'loves', 'chandler']



shift() : 배열의 맨 앞의 값 삭제

let names = ['sora', 'loves', 'chandler'];
let answer = names.shift();

console.log(answer) //['loves', 'chandler']



sort() : 배열 정렬

(sort도 할말이 많은 메소드라 나중에 따로 빼서 정리한번 해야지;;;;)

const arr = [2, 1, 3, 10];
arr.sort();	//[1, 10, 2, 3] => 유니코순서이므로 10이 2보다 작게나옴. 

//우리가 원하는건 1,2,3,10이기 때문에 콜백함수를 써줘야함
const arr = [2, 1, 3, 10];
//오름차순
let answer = arr.sort(function(a, b)  {
  return a - b;
});
console.log(answer) 	//1, 2, 3, 10

//내림차순
let answer = arr.sort(function(a, b)  {
  return b - a;
});
console.log(answer) 	//10, 3, 2, 1

//오름차순 화살표함수
arr.sort((a,b) => a - b);	//1, 2, 3, 10
//내림차순 화살표함수
arr.sort((a,b) => b - a);	//10, 3, 2, 1



concat() : 배열 합치기

let names = ['joey','pheobe','ross'];
let numbers = [1,2,3]
answer = names.concat(numbers);

console.log(answer)	//['joey','pheobe','ross', 1, 2, 3]



slice(시작인덱스, 생략가능한마지막인덱스) : 특정 범위를 복사한 값을 담고 있는 새로운 배열 생성. 원본배열 훼손하지 않음

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.slice(2,5);	//[3, 4, 5] 마지막인덱스의 값은 포함하지 않음. arr[5]는 6인데 6은 포함하지 않으므로 [3,4,5]만
arr.slice(8);	//[9, 10] 마지막인덱스 생략시 끝 값까지 포함



splice(시작인덱스, 삭제할값의개수, 추가할값) : 특정범위 삭제하거나 새로운 값 추가하거나 기존 값 대체 가능. 원본배열 훼손하므로 주의

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.splice(2,2)	//[3, 4]
arr //[1, 2, 5, 6, 7, 8, 9, 10]

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.splice(2, 0, '-')
arr //[1, 2, '-', 3, 4, 5, 6, 7, 8, 9, 10]

2번째 인덱스부터 아무것도 변경하지 않고 ‘-‘를 추가한다 (=아무것도 변경하지 않으므로 추가가 되는것. 변경할 값이 있으면 대체)

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.splice(2, 2,'안','녕')	//[3, 4]
arr //[1, 2, '안', '녕', 5, 6, 7, 8, 9, 10]

2번째 인덱스부터 2개의 값을 ‘안’과 ‘녕’으로 대체한다





객체 : 여러 프로퍼티를 받는 데이터타입

객체 안의 데이터에 접근하는 방법은 2가지로 나뉜다. 아래와 같은 객체가 있다고 하면,

let userData = {
	name : 'sora',
	age : 30
}

  • dot notation : . 으로 접근

    userData.name //sora

  • bracket notation : []으로 접근

    userData['age']	//30

2가지 방법으로 객체에 접근하면 된다


잠깐☝🏻

console.log(userData[age])	//undefined

let name = "age";
console.log(userData(name)) //30

위와 아래는 분명하게 다름. 브라켓 노테이션으로 접근하려면 age가 문자열(userData['age'])이던가 변수(let age = whatever)여야 함.

근데 변수선언도 안해주고 브라켓노테이션으로 age에 접근하려고 하니까 undefined 뜨는거임

밑에는 name을 변수로 선언해줬으므로 30이 뜨는것

결과적으로는 userData(name)가 userData['age'] 과 동일한 말이니까.


객체 메소드

  • Object.keys() : 주어진 객체의 key만을 가져와 배열에 담아주는 메서드

    let soraData = {
	name : 'sora',
	age : 30,
	gender : 'female'
}
  
let result = Object.keys(soraData);
console.log(result);	//['name','age','gender'];

  • Object.values() : 주어진 객체의 values만을 가져와 배열에 담아주는 메서드

    let soraData = {
	name : 'sora',
	age : 30,
	gender : 'female'
}
  
let result = Object.values(soraData);
console.log(result);	//['sora', 30, 'female'];







© 2018. by sora

Powered by sora