라벨이 default인 게시물 표시

[React] static defaultProps 기본값 설정하기

이미지
props 기본값 설정하기 상위 컴포넌트로부터 하위 컴포넌트에 props로 값이 전달되지 않은경우 기본적으로 보여질 값을 설정할 수 있다. 위와같이 static defaultProps에 기본값을 설정하면 상위컴포넌트에서 하위컴포넌트로 값이 전달되지 못할때 기본props 값으로 설정된 '기본이름'이 값으로 입력되어 아래와같이 출력된다. 한가지 방법이 더 있는데 결과값은 똑같고 표현방법만 살작다르고 똑같이 동작하는 코드이다. 👇🏼👇🏼👇🏼   두가지 방법중에 최신방법은 맨위에 처음 작성한 static defaultProps 방법이므로 되도록 최신방법을 사용하자. 위 두가지 방법은 class형 컴포넌트에서 사용되는 방법이고 함수형 컴포넌트에서는 default parameter를 통해 기본 값을 설정할 수 있다. 만약에 props로 전달되는 값이 없다면 이와같이 default parameter로 값을 지정해줄 수 있다. 이렇게 작성한경우 props로 값이 전달되지 않은경우 아래와 같은 결과가 나오게된다.   위 결과는 props로 name, age둘다 값이 전달되지 않아 기본값으로 반환한 결과이며 props중 age값만 9999로 전달할 경우  안녕하세요 제 나이는  9999 살이며 이름은  안녕하세요  입니다. 라는 결과 값을 반환한다.

default paramaters (매개변수 기본값 설정)

이미지
default paramaters 매개변수에 들어올 인자값이 없는경우 매개변수 기본값 지정하기 매개변수 value1과 value2에 인자를 모두 받아야하는데 하나의 매개변수에만 인자값이 들어오고 나머지 하나에 들어오지않을경우 NaN을 반환한다.  하지만 위처럼 매개변수로 들어올 인자가 존재하지않더라도 리턴값을 반환할 수 있다. 위 사진처럼 parameter값으로 (2,2)를 받게될 경우 인자값을 그대로 연산하여 4를 반환한다. parameter값으로 두개의 인자가 아닌 (3)하나만 인자로 들어와도 parameter기본값으로 1이 지정되어있어서 똑같은 값 4가 반환된다. 마지막으로 sum함수에 매개변수로 어떠한 인자도 받지않는다 하더라도 parameter기본값으로 1이 지정되어있어서 2를 반환한다.