본문 바로가기
  • " 집요함 "
  • " 집요함 "
  • " 집요함 "
웹/백엔드 서버

Javascript Essential : ES6+ 문법

by joen00 2022. 4. 11.

1. 변수 선언 방법

var를 사용하면 안되는 이유 : 호이스팅이 적용이 되면서 변경이 된다. 따라서 유지보수를 해칠 수 있다. 중복선언이 가능하다. 이것들은 에러를 발생시키지 않고 undefined로 나오기 때문에 안좋다.

const와 let를 사용해준다.

const number1 =10
let number2 =10

 

2. 함수 선언

 // 함수 표현식 
const printmeg=function(num){
	console.log(num)
}
// 함수 람다식
const printmeg=(num)=>{
	console.log(num)
}
// 함수 람다식 (변수가 1개일때 , 소괄호와 중괄호 생략 가능)
const printmeg=num=>console.log(num)
printmeg(10)

 

3. array helper = map, reduce, filter, forEach

for문으로 쓰게 되면 코드라 더럽고 해석이 오래 걸린다.

 

1) forEach로 쓰는 법 

출력할 때 많이 쓰인다.

value는 배열의 각 요소들(1~5)이다. index는 배열의 index값들(0~4)이다.

const dataList=[1,2,3,4,5]
let sum=0
dataList.forEach((value, index)=>{
	sum += value
})

 

2) map

map은 결과를 다른 배열에 담길 수 있도록 도와준다.

resultList에 value에 곱한 값들이 들어간다.

const dataList=[1,2,3,4,5]
const result2List = dataList.filter((value)=>{
	return value < 3
})
console.log(result2List)

 

3) filter

다른 배열에 옮겨주는 것

뭔가를 거를때

const dataList=[1,2,3,4,5]
const result2List=dataList.filter((value)=>{
	return value < 3
})
console.log(result2List)

 

4) reduce 

reduce 도 다른 곳에 옮기는데 변수에 옮긴다.

어떤 룰에 의해서 하나의 변수로 옮겨주겠다.

current는 앞에 나온 결과를 저장하는 것.

const dataList=[1,2,3,4,5]
const result = dataList.reduce((value, current)=>{
	return value + current // 배열의 합 구하기
}, 0) // current의 초기값

const result = dataList.reduce((value, current)=>{
	return Math.min(value, current)
}, dataList[0]) // current의 초기값

 

4. Template Literal 출력할 때

console.log(`${center}의 2기 팀원 ${member} 입니다.`)

let number = 20
const power = (()=>{
    return num *num
})
console.log(`${number}의 제곱은 ${power(number)} 입니다.`)

 

728x90

댓글