앱 개발에 자주 쓰이는 JavaScript 3

하이루·2021년 10월 5일
0

Map - 반복문(for문)의 또 다른 방식

--> for문과는 다르게 길이를 몰라도 됨, 각 값이 몇번째 값인지 오히려 알려줌
--> for문처럼 단독이 아니라 List의 함수처럼 사용

--> 리스트의 순서대로 뭔가를 진행할 때는 for문보다 Map 쓰는게 훨씬 간편하다

[함수축약 사용] --> 이걸로 씁시다
let numbers = [1,2,3,4,5,6,7]
numbers.map((value,i) => {
console.log(value,i)
})

--> numbers 리스트를 순서대로 순회하면서 value에 값을, i 에 그 값의 순서를 넣어서 각 회차를 실행시킴

[함수 축약 미사용] --> 내용은 동일
numbers.map(function(value,i) {
console.log(value,i)
})

출력-->1 0 (값, 그 값이 몇번째 인지)
2 1
3 2
4 3
5 4
6 5
7 6

--> value는 각 구간의 값, i는 그 값이 몇번째인지 출력

자바스크립트 파일을 모듈화

export --> 값, 함수, 딕셔너리(객체) 또는 자바스크립트 파일 자체를 외부로 내보내는 키워드
--> 외부롤 내보낸다는 것은 밖에서 쓸수 있게 준비한다는 의미

import --> 값, 함수, 딕셔너리(객체) 또는 자바스크립트 파일 자체를 내부로 가져오는 키워드
--> 내부로 가져온다는 것은 외부로 내보낸 것들을 가져온다는 의미

예) export, import 기본 예시

util.js파일
--> 두개의 함수를 만들어서 내보냄(export)

export function times(x){
return x * x;
}
exprot function plusTwo(number){
return number + 2
}

index.js파일
--> util.js로부터 함수 두개를 가져와서(import) 사용
--> 이는 util.js에서 그 함수들을 export해줬기 때문에 가능한 것

import (times, plusTwo ) from './util.js';
console.log(times(2));
console.log(plusTwo(3));

예2) --> export default 사용

util.js파일
--> export default를 지정해줌

export default function times(x){
return x * x;
}

index.js파일
--> 어떤 함수를 불러올지 따로 명시하지 않더라도 변수 k에 util.js의 export
default 설정되어있는 times(x) 함수가 할당됨

import k from './util.js';
console.log(k(2));

profile
ㅎㅎ

0개의 댓글