3. 자바스크립트 축약형 문법

IngCoding·2022년 10월 26일
0
  • 문법 검색은 ES6

1. 함수를 축약 == 화살표 함수

  • function() {}
  • () => {}
let a = function() {
	console.log("nomal")
}
a()

let b = () => {
  console.log("arrow")
}
b()

2. 딕셔너리 키, 값 빠르게 꺼내기 == 비구조할당 { }

//객체 
let blog = {
	owner : "noah",
	url : "noahlogs.tistory.com",
	getPost() { 
		console.log("ES6 문법 정리"); 
	}
};

//기존 할당 방식
let owner = blog.owner
let getPost = blog.getPost()

//비구조 할당 방식
let { owner, getPost } = blog;       
//각각 blog 객체의 owner , getPost() 의 데이터가 할당
//blog의 키 값과 이름이 같아야 해요!
//(예 - owner가 아니라 owner2를 넣어보세요! 아무것도 안 들어온답니다.)

// 앞으로 리액트 네이티브 앱을 만들며 가장 많이 사용할 방식

//함수에서 비구조 할당 방식으로 전달된 딕셔너리 값 꺼내기
let blogFunction = ({owner,url,getPost}) => {
	console.log(owner)
	console.log(url)
	console.log(getPost())
}

blogFunction(blog)

3. 줄바꿈을 자유롭게! - 리터럴

let message = ` 줄바꿈도 마음대로
사용이 가능합니다. `
let message = `새로 
만들기`

4. 딕셔너리를 짧게 - 객체 리터럴

  • 변수와 키 이름이 같으면 반복할 필요가 없음.
// 기존 방식
ar job = "developer";

var user = {
  name: name,
  job: job
}

console.log(user);

// 최신 방식
var name = "스파르타";
var job = "developer";

var user = {
  name,
  job
}

console.log(user);

5. 반복문 축약 - map

let numbers = [1,2,3,4,5,6,7];

// 기존
for(let i=0; i<numbers.length; i++){
	console.log(numbers[i]);
}

// 최신 - 리스트 값과 순서를 함께 표시 
numbers.map((i,value) => { 
	console.log(i, value) 
})
profile
Data & PM

0개의 댓글