[JavaScript] 함수

2023. 4. 17. 00:43·JavaScript
728x90
728x90

함수

  - 자바스크립트에서는 함수 자체가 표현식임

      → 함수를 변수에 할당하거나, 함수의 매개변수로 사용할 수 있음

 

 

함수 정의

#  일반 함수

  - 호이스팅 (Hoisting, 갈고리) 기술 지원

      : 호출문이 함수 정의문보다 먼저 나와도 호출문이 정상 작동함

  - 매개변수가 있는 함수를 매개변수 없이 호출한 경우

      : 매개변수가 포함된 코드에는 Undefined 출력

  - 매개변수를 배열로 받으면 많은 양을 간단하게 처리 가능

 

1
2
3
4
5
6
7
8
9
// 매개변수가 없는 함수
function 함수명() {
    코드;
}
 
// 매개변수가 있는 함수
function 함수명(매개변수1, 매개변수2, ...) {
    코드;
}
Colored by Color Scripter
cs

 

#  익명 함수

  - 이름이 없는 함수

  - 호이스팅 기술 미지원

      → 호출문이 함수 정의문보다 먼저 나오면 오류가 발생함

  - 앞 호출문에 오류가 발생하면, 정상 위치의 호출문도 오류가 발생함

 

1
2
3
let 함수명 = function() {
    코드;
}
cs

 

#  즉시 실행 함수

  - 익명 함수의 일종

  - 이름이 같은 함수로 만들어도 둘 다 각각 호출됨

  - 즉시 실행 함수를 변수에 담으면, 함수 자체가 아닌 함수 실행 결과 값이 담김

 

1
2
3
4
5
6
7
8
9
// 매개변수가 없는 함수
(function() {
        코드;
})(); 
 
// 매개변수가 
(function(매개변수a, 매개변수b){
        코드;
})(인수a, 인수b); 
cs

 

#  화살표 함수

  - => 표기법을 사용해서 함수 선언 부분을 간단하게 작성함

 

1
2
(a, b) => {return a + b};
(a, b) => a + b;
cs

 

 


#  매개변수를 선언하지 않고, 함수에 전달된 값 받아오기

1
2
3
4
5
6
7
// 정의
function 함수명() {
    let 변수 = arguments[0] + arguments[1] + arguments[2] + ...;
}
 
// 호출
함수명(데이터1, 데이터2, 데이터3, ...);
Colored by Color Scripter
cs

 

 

반응형
728x90

함수 종료

#  return

  - 값을 반환하고 함수를 종료시킴

 

#  break

  - 함수를 종료시킴

 

 


재귀 함수

  - 자기 자신을 호출하는 함수

 

1
2
3
4
function 함수명a() {
    코드;
    함수명a();
}
cs

 

 


기타 메모

- 전역 함수 : 일반적인 함수
- 지역 함수 : 함수 내에서 정의된 함수

- 함수 스코프 : 함수 구현부 { }의 범위
- 전역 변수 : 함수 밖에서 정의된 변수    → 모든 영역에서 사용 가능한 변수
- 지역 변수 : 함수 내에서 정의된 변수    → 함수 내에서만 사용 가능하며, 외부에서는 접근할 수 없는 변수

- 매개변수 (Parameter) : 함수 선언 시 필요하다고 지정하는 변수
- 인수 (Argument) : 함수 실행 시 매개변수로 넘겨주는 값

 

320x100
반응형
저작자표시 비영리 변경금지 (새창열림)

'JavaScript' 카테고리의 다른 글

[JavaScript] 내장 함수  (0) 2023.04.17
[JavaScript] 객체 생성자 함수 (사용자 정의 객체)  (0) 2023.04.17
[JavaScript] BOM : history 객체  (0) 2023.04.17
[JavaScript] BOM : location 객체  (0) 2023.04.17
[JavaScript] BOM : screen 객체  (0) 2023.04.17
'JavaScript' 카테고리의 다른 글
  • [JavaScript] 내장 함수
  • [JavaScript] 객체 생성자 함수 (사용자 정의 객체)
  • [JavaScript] BOM : history 객체
  • [JavaScript] BOM : location 객체
스응
스응
    반응형
    250x250
  • 스응
    이서영의 개발 블로그
    스응
  • 전체
    오늘
    어제
  • 글쓰기 관리
    • 분류 전체보기 (384)
      • Java (134)
        • Base (54)
        • Spring Boot (37)
        • JSP (16)
        • Swing (GUI) (20)
        • Design Pattern (7)
      • C# (13)
      • PHP (18)
      • SQL (27)
      • Vue.js (9)
      • Tailwind CSS (4)
      • TypeScript (7)
      • HTML & CSS (27)
      • JavaScript (26)
      • jQuery (10)
      • Android (3)
      • - - - - - - - - - - - - - - (0)
      • Hotkeys (5)
      • CS (30)
      • etc. (13)
      • Error Note (16)
      • Team Project (24)
        • Airlines Web Project (12)
        • University Web Project (6)
        • Strikers 1945 GUI Project (6)
      • My Project (18)
        • Library Web Project (8)
        • Pet Shopping Mall GUI Project (10)
  • 블로그 메뉴

    • Home
    • Write
  • 링크

    • 깃허브
  • 공지사항

  • 인기 글

  • 태그

    Swing
    C#
    java
    SQL
    tailwindcss
    vuejs
    오블완
    http
    SpringBoot
    SEO
    HTML
    php
    Hotkeys
    개발일지
    errorNote
    CSS
    jsp
    Android
    cs
    면접
    typeScript
    jQuery
    Wordpress
    SWAGGER
    git
    zapier
    티스토리챌린지
    js
    Codeigniter
  • 최근 댓글

  • hELLO· Designed By정상우.v4.10.0
스응
[JavaScript] 함수
상단으로

티스토리툴바