• 티스토리 홈
  • 프로필사진
    alpha brain
  • 방명록
  • 공지사항
  • 태그
  • 블로그 관리
  • 글 작성
alpha brain
  • 프로필사진
    alpha brain
    • 분류 전체보기 (93)
      • SOFTWARE DEVELOP (68)
        • REACT.JS (3)
        • WEBPACK (4)
        • HTML&CSS (2)
        • EXPRESS (0)
        • DATABASE (0)
        • NODE.JS (3)
        • JAVASCRIPT (24)
        • DOCKER (1)
        • Linux (3)
        • Git (6)
        • GRAPHQL (0)
        • Datastructure (7)
        • Development (6)
        • HTTP (1)
        • Programming Paradigm (1)
        • Algorithm log (5)
        • DEV log (1)
        • Project log (0)
        • I don't know yet (1)
      • 경제, 재무 (23)
      • 여행 (0)
      • 시사, 상식 (2)
  • 반응형
    250x250
  • 방문자 수
    • 전체:
    • 오늘:
    • 어제:
  • 최근 댓글
      등록된 댓글이 없습니다.
    • 최근 공지
        등록된 공지가 없습니다.
      # Home
      # 공지사항
      #
      # 태그
      # 검색결과
      # 방명록
      • [Javascript] 함수
        2020년 01월 10일
        • alpha brain
        • 작성자
        • 2020.01.10.:04
        728x90
        반응형

        1.함수

        수학에서의 함수와 비슷한 개념으로 생각하면 좋을것 같다.

        f(x+10) = y   ---> f 에 x 를 집어넣으면(input )y가 나온다.(output)

        프로그래밍에서도 거의 동일하게 작성된다. 

        function f([input, input2, ...]){
          const output = input + 10;
          return output;
        }

        input이 오면 그 값에 10을 더해주고 내보낸다. (return)

        function f2(input){
          const output = input + 10;
        }

         

        프로그래밍에서는 return 키워드를 사용하지 않으면 해당 함수는 함수 밖에서 output을 이용한 값을 사용할수가 없다. 이 부분이 수학에서의 함수와 가장 큰 차이점이라고 생각한다.

        2.함수의 사용(실행)

        프로그래밍에서는 함수를 실행할때는 '함수명([input])'으로 실행시킨다.

        f(10); // 20;
        f2(10); // undefined
        • return 을 사용한 함수(f)와 사용하지 않은 함수(f2)의 차이점은 함수 실행후를 보면 알수가 있다. f(10)은 그 값을 20(number type)을 가지고 있지만 f2(10)은 undefined를 가지게 된다.
        • 값을 할당하여 사용한다면 return문을 사용해 함수 실행후 변수에 저장해서 사용할수가 있다.
        const score = f(10) // score is 20 (number type)
        const yourscore = f2(10) // yourscore is undefined (undefined type)
        • 함수내부에서의 어떤 값을 다른 로직에서 사용한다면 return을 사용하여 해당 값을 사용할수 있게 해주어야 한다.
        • 다른로직에서 사용해야할 값을 f2처럼 만들었다면 에러(error)가 날것이다.

        3.why use Function?

        1. 가독성이 좋아진다.
        2. 중복되는 코드가 줄어든다.
          • 다음의 예시를 보면
        // 학생 3명의 과목 평군점수 구하기
        
        function calcStudentsAverage(){
        	const std1Name = '초코';
        	const std1Math = 90;
        	const std1Eng = 85;
            
            const average1 = std1Math + std1Eng / 2
            
        	const std2Name = '뭉치';
        	const std2Math = 88;
        	const std2Eng = 80;
            
            const average2 = std2Math + std2Eng / 2
            
        	const std3Name = '니로';
        	const std3Math = 93;
        	const std3Eng = 87;
            
            const average3 = std3Math + std3Eng / 2
            // 만약 30명의 평균을 구해야 한다면?
        }
        만약 1000명이라면 아마 도중에 그만둘지도 모르겠다..
        function calcStudentAverage(name, math, eng){
        	return math + eng / 2;
        }
        
        function calcStudentsAverage(){
        	const student1 = calcStudentAverage('초코',90,85);
           	const student2 = calcStudentAverage('뭉치',88,80);
        	const student3 = calcStudentAverage('니로',93,87);
            
            // 이후 저장된 변수들로 추가적인 작업도 가능하다.
        }
        • 중복되는 부분을 함수로 작성해주면 가독성이 높아지게 된다.
        • 꼭 중복되지 않더라도 함수로 작성을 해두면 이 코드가 어떤일을 하는지 함수명으로 알수있기 때문에 코드 이해도 빨라지게 된다. 

        728x90
        반응형

        'SOFTWARE DEVELOP > JAVASCRIPT' 카테고리의 다른 글

        [Javascript] Object(기본,리터럴)  (0) 2020.01.12
        [Javascript] 인자(argument)와 매개변수(parameter)  (0) 2020.01.12
        [Javascript] 연산자와 boolean Type  (0) 2020.01.11
        [Javascript] 배열(Array)  (0) 2020.01.11
        [Javascript] 변수와 값(타입)  (1) 2020.01.07
        다음글
        다음 글이 없습니다.
        이전글
        이전 글이 없습니다.
        댓글
      조회된 결과가 없습니다.
      스킨 업데이트 안내
      현재 이용하고 계신 스킨의 버전보다 더 높은 최신 버전이 감지 되었습니다. 최신버전 스킨 파일을 다운로드 받을 수 있는 페이지로 이동하시겠습니까?
      ("아니오" 를 선택할 시 30일 동안 최신 버전이 감지되어도 모달 창이 표시되지 않습니다.)
      목차
      표시할 목차가 없습니다.
        • 안녕하세요
        • 감사해요
        • 잘있어요

        티스토리툴바