javascript_함수(function)

함수

• 웹3에서 제일 중요!

• 같은 작업을 필요할 때마다 불러서 한 번 사용
  (값을 변경하면서 같은 작업 - 매개변수)

  console.log("1");
  function add(){
  	console.log("add 실행");
  }
  console.log("2");
  window.add();
  console.log("3");
  -> 1
    2
    add 실행
    3

• 전역변수를 직접 가져다 쓰면 함수의 독립성이 깨짐.
  그래서 가급적이면 변수를 보내서 그 값으로 함수를 실행하는 것이 좋다.
  한가지 일만 실행하게 하는 것이 좋다.
  외부파일로 다른 곳에서 해당 function을 사용할 수 있으므로 전역변수를 직접 가져다 쓰는 것을 비추천하는 것이다.
  매개변수로 값 주고, return으로 값 보내는 것이 가장 좋은 코드.

  let num = 10;
  function add(){
  	console.log(num);
  }
  window.add();
  
  ---------------------------
  
  let num = 10;
  function add(number){ -> number이 매개변수임.
  	console.log(number);
  }
  window.add(num);

• function을 부르기 전에 선언해놔야 부를 수 있다.

중복선언

• 같은 이름으로 함수를 선언할 때

  function add(){
  	console.log("111");
  }
  function add(){
  	console.log("222");
  }
  add();
  -> 222
  
  ----------------------
  
   function add(number, tt){
  	console.log("111");
  }
  function add(){
  	console.log("222");
  }
  add(num, tmp);
  -> 222

  • function 선언한 것을 처음부터 불러오는 위치까지 다 읽는다.
    그래서 같은 이름의 함수를 만들면 무조건 마지막에 생성한 함수로 동작한다.
    매개변수개수 상관 없음. 조심해야함.
    다른 외부 js파일에 같은 이름이 있다면 해당 함수를 불러올 수 있으니 꼭 주의!

함수명 생성 규칙

(변수명때와 동일)

• 첫번째 글자 영문, $, _
• 같은 이름 함수있으면 안됨 (오류는 안나지만 중복선언에서 말한 이유때문임)
• 대소문자 구분
• 띄어쓰기 x

함수 종류

1. 선언적함수 : 함수명이 있는 함수
   • function 함수명(){ }
   • 이름표를 달아놓고 원할 때 불러옴
2. 익명함수 : 함수명이 없는 함수

   let 변수명 = function 함수명(){  }
   변수명();

   • 변수에 담아서 사용
   • 변수에 담은 이후에만 익명함수 사용 가능.
     이름표가 없기때문에 부를 수가 없기 때문이다.

return

• 결과값을 해당 함수를 부를 자리에 돌려보냄.

  function add(num1, num2){
  	return(num1 + num2);
  }
  let result = 100;
  console.log(add(1, 2));
  console.log(result * add(1, 2));
  -> 3
     300

콜백함수

• 익명함수로 만드는 것을 추천.
• 콜, 백
• 함수에서 함수를 콜
• 함수를 부르는 곳에서는 선언적함수를 보낼 수 없어서 무조건 익명함수를 사용해야한다.

  let aa = function(){
  	console.log("aa");
  }
  let bb = function(){
  	console.log("bb");
  }
  function tmp(txt, func_a, func_b){
  	if(txt == "여기"){
    	func_a();
    }else{
    	func_b();
    }
  }
  tmp("여기", aa, bb);
  tmp("저기", aa, bb);
  -> aa
     bb

  • 함수를 부르는 곳에서 선언적함수를 보낼 수 없는 이유는
    tmp("여기", aa(), bb);이렇게 선언했을 때 tmp 함수를 불렀으나 aa()를 보는 순간 aa함수를 부르게 되기 때문이다.

화살표함수 (최근에 나옴)

• function 키워드 대신 화살표(=>)를 사용해서 보다 간략한 형식으로 함수를 선언할 수 있다.
  하지만 모든 경우에 화살표 함수를 사용할 수 있는 건 아님.
• 익명 함수로만 사용할 수 있다. 그래서 화살표 함수를 호출하기 위해서는 함수표현식을 사용한다.

  let tmp = () => {
  	console.log("aa");
  }