[패스트캠퍼스 수강 후기] 프론트엔드 인강 100% 환급 챌린지 1회차 미션

패스트캠퍼스 프론트엔드 인강 1일차. 자바스크립트 함수부분을 공부해보았다.

 

함수는 특정코드를 하나의 명령으로 실행할수있게하는 기능.

그외에도 파라미터값이 주어졌을때 파라미터를 처리해서 결과를 만들어낼수있다.

 

예시

        //파라미터값 숫자
        function add(a, b) {
            return a + b;
        }
        const sum = add(1, 2);
        console.log(sum)

        //파라미터값 문자
        function hello(name){
            console.log('hello '+name+'!');
        }
        hello('dubaiyu');

파라미터값이 숫자로들어간 add함수의 결과는 3이 나오고

파라미터값이 문자로 들어간 hello함수의 결과는 hello dubaiyu!가 나온다.

문자열을 이으려면 + 를 사용해야하는데 es6문법을 통해 +를 사용하지않고 간편하게 표현할수있다.

es6란?

ECMAScript 6를 의미하며 자바스크립트 버전 2015년 문법으로 현재는 es10(2019년도)까지 나옴

 

예시

        //(ES6)파라미터값 문자
        function hello2(name){
            return `hello ${name}!`;
        }
        const result = hello2('dubai')
        console.log(result)

결과값은 hello dubai!

*함수내 return을쓰면 함수는 종료된다.

 

응용: 성적 계산하기

        //성적계산하기
        function score(number){
            if(number === 100){
                return 'A+';
            }else if(number >= 90){
                return 'A';
            }else if(number >= 80){
                return 'B+'
            }else{
                return 'B'
            }
        }
        const grade = score(89)
        console.log(grade)

성적으로 score함수에 89을 입력하면 B+이 나온다.

getGrade함수에 70을 입력할경우 C가 나온다.

 

화살표함수를 통해서도 함수를 쉽게 표현할수있다. 더 코드를 짧고 간결하게 쓸수있다.

       //ES6 화살표를 통한 간결한 함수
        const add2 = (a,b) => a + b;
        const sum2 = add2(7,3)
        console.log(sum2)

결과값

https://bit.ly/31Cf1hp

프론트엔드 개발 올인원 패키지 with React Online. | 패스트캠퍼스