2018년 4월 24일 화요일

javascript function에 관한 노트

서핑중
function foo(){}

const foo = ()=>{}
가 같은 의미로 쓰이지만, 특히 후자가 더 선호된다는 이야기를 들었습니다.

궁금증이 좀 생겨서 알아보는데..


1.arrow function 의 인자값이 없다면 _ 로 처리가 가능하다.

const foo = _ =>{}

2. arrow function 은 this 가 없다. 이때 this는 상위 scope를 따라게기 된다.

const foo = _ =>{console.log(this);} 를 현제 웹 페이지의 콘솔에 친다면,
현제 인터넷창 windows가 출력될 것이다!/node shell에서는 node객체가 출력되는것 같다!

다음으로 넘어가기 전에 잠깐 확실하게 해둘것이 있다.
Parameter와 Argument 의 차이를 짚고 넘어가야 할것 같다.
검색했을때 좋은 예제가 나왔는데,
void Foo(int a,int b){}
void main(){
 Foo(1,2);
}
에서 Foo함수의 int a 와 b 를 Parameter,
Foo(1,2)에서의 1과 2를 Argument라고 부른다.
Arguments는 넘겨주는 값/변수/레퍼런스 따위를 부르며,
Parameters는 fuction/block등을 통해 넘겨받은 변수값을 칭한다.


3. arrow function에서는 arguments객체가 없기 때문에, 가변 인자의 경우 spread연산자로 변수를 하나 선언하여 담아 보낼수 있다.

여기서 처음보는 spread연산자가 나타나 내 머리를 헤집기 시작하는데,
간단하게 arguments인자값을 배열 따위로 순차적으로 넣을 수 있게 만드는것 같다.
예제코드를 보면 이해가 쉽다.
function foo ( a, b, c, d, e, f){return a+b+c+d+e+f}
const a = [1,2,3];
const b = 4;
const c = [5,6];
console.log(foo(...a,b,..c));
출력은 21이 찍힌다.
foo의 인자값으로 6개의 변수를 받아야 하는데, a 와 c 배열의 모든 인자값들을 포함하여 6개의 인자를 채우려고 할때, spread연산자를 쓸 수 있다.
... 가 spread연산자 기호이다. 

정도의 좋은 정보들을 잔뜩 얻게되었습니다.

...
그래서 왜 function (){}보다 arrow function이 좋은가? 에 대해서는 아직까지 명쾌한 해답은 듣지 못했다(...)


댓글 없음:

댓글 쓰기