본문 바로가기

Javascript12

구조 분해 할당 자바스크립트에 알아두면 좋은 구조 분해 할당이다. 배열, 객체의 속성을 해체하고 그 값을 변수에 담을 수 있다. es6 이전에는 직접 객체에 접근하여 값을 할당해야했지만 구조 분해 할당이 생기고 나서 더 쉽게 객체를 조작할 수 있다. {} 구문 안에 변수를 선언하고 객체를 대입하면 해당 프로퍼티의 값이 할당된다. 배열의 값도 동일한 방식으로 할당할 수 있다. 함수를 쓰는 작업을 하다보면, 들어온 값의 여부를 체크하거나 default값 설정등의 행위를 해야하는데, 매개변수에 오브젝트를 선언해두고 default값을 선언하여 사용할 수 있다. 예를 들어, 상품 결제를 하게되었을때 default 값을 설정해두면 혹시라도 매개변수를 잊어서 에러가 나거나 혹은 상수로 디폴트값을 두고 관리하는 수고를 줄일 수 있다... 2020. 9. 7.
Refactoring - 양수값 구하기 Q. 들어온 값을 양수 문자열로 만드는 함수를 작성하시오. 음수가 들어왔을 경우 () 괄호로 묶어준다. ex) 1 => '1', '-2' => ('2') A. 1 2 3 4 5 6 7 8 function getAmount(n) { if (n = 0) { return n.toString(); } } Colored by Color Scripter cs n이 값이 0보다 작으면 Math 함수 절대값 구하고 else if는 n값을 toString으로 변경했다. 평범하다고 생각할 수 있지만 다음 코드를 보고 생각해보자. A. 1 2 3 4 5 6 7 function numberToAmountString(number) { if (number != null) { return `(${Math.abs(number)})`.. 2020. 9. 2.
Default Props Props의 값을 default로 설정할 수 있다. props로 들어온 값이 없으면 default 값이 작동한다. 1 2 3 4 5 6 7 8 9 10 11 import React from 'react'; function Title({name}) { return This is {name} } Title.defaultProps = { name : 'Angular' }; export default Title; cs 보내주는 props값을 없애고 다시 실행해본다. props의 값이 없어 default값이 설정되었다. 2020. 8. 22.
변수, 클래스 네임 1 2 3 4 5 6 7 8 9 function App() { const hello = "Java Script" return ( {hello} ); } cs 자바 스크립의 변수 가져오기 { } 를 이용한다. 2. 클래스 네임 1 2 3 4 5 6 7 8 9 10 11 12 import React from 'react'; import './App.css'; function App() { return ( ); } export default App; cs 리액트내에서는 클래스 선언은 className을 사용한다. 2020. 8. 22.