본문 바로가기

Javascript/기초부터 다시 시작

자바스크립트 함수

함수 선언

function doSomething() {

   console.log('hello');

}

 

function add(a, b) {

  const sum = a + b,

return sum;

}

 

함수 호출

doSomething();

 

const result = add(1, 2);

console.log(result);

 

함수의 역할 

1. 기능을 하고 그냥 끝

2. 계산을 하고 특정한 값을 전달

 

 

 

 

 


 

 

 

 

function getArea() {

  let  width = 10;   →    2

  let height = 20;   →    3

 

  let area = width * height;   →    4

console.log(area);    →    5

} //함수 선언식, 함수 선언 방식의 함수 생성

 

getArea();     →    1

console.log("함수 실행 완료");

 

 

 

 

 

<매개변수>

function getArea(width, height) {

  let area = width * height;

console.log(area);

}

getArea(100,200);

console.log("함수 실행 완료"); 

 

 

함수의 결과값을 변수에 할당 받아 받아보고싶다면 return을 사용하면 됨

함수 내부에 리턴을 써서 어떤 값을 오른쪽에 위치시켜주면 함수 자체를 반환하게 되는 것

 

 


 

지역 변수 : 함수 내부에 선언한 변수나 상수는 그 함수의 밖에서는 접근을 할 수가 없음. 함수 내에 선언된 변수는 이 지역을 벗어날 수 없다

 

function getArea(width, height) {

  let area = width * height;

  return area;

}

 

let area1 = getArea(100,200);

console.log(area); 

=> area is not defined


전역 변수 (글로벌 변수) : 함수 외부에 선언되어 어디에서나 접근할 수 있는 변수

 

let count = 1;

function getArea(width, height) {

 console.log(count)

  return area;

}

 

let area1 = getArea(100,200);

=> 잘 출력됨!

 


함수를 값처럼 취급해서 변수나 상수에 담기

 

(함수를 값에 담을 때는 굳이 함수의 이름을 지정해 줄 필요가 없음)

let hello = function (){

   return "안녕하세요 여러분";

} //함수 표현식 (무명함수 / 익명함수 사용 - 이름이 없도록 만들어서 변수에 담아서 활용)

 

function helloFunc() {

   return "안녕하세요 여러분";

} //함수 선언식

 

const helloText = hello();

console.log(hello);

=>hello라는 변수는 함수를 담고 있는 것!

 

두 방식의 차이점

console.log(helloB());     - 이렇게 선언되기도 전에 호출하는 것 = 호이스팅 

 

let helloA = function (){

   return "안녕하세요 여러분";

} //함수 표현식 (무명함수 / 익명함수 사용 - 이름이 없도록 만들어서 변수에 담아서 활용)

let helloA = () => {

   return "안녕하세요 여러분";

}

 

 

function helloB() {

   return "안녕하세요 여러분";

} //함수 선언식

 

함수 선언식으로 만들어진 함수들은 프로그램 실행 전에 코드의 최상단으로 끌어올려짐!!

함수 표현식은 호이스팅 이뤄지지X

'Javascript > 기초부터 다시 시작' 카테고리의 다른 글

조건문 업그레이드  (0) 2023.04.02
삼항연산자  (0) 2023.03.22
배열  (0) 2023.03.20
콜백함수  (0) 2023.03.17
자바스크립트 변수 & 상수  (0) 2023.03.14