<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ex01함수기초</title>
</head>
<body>
<script>
// 호이스팅(Hoisting) 끌어올리기
// 함수를 실행하기 전에 함수 안에 있는 모든 선언들을
// 전역으로 끌어올려서 전체 영역에서 사용가능하게 끔 만들어주는 것
// --> 최상단에 선언해주는 것
addNum(5,6)
// 자바스크립트에서 함수를 만드는 방법
// 1. 함수 선언문(function declarations)
// : 호이스팅(최상단으로 끌어올려지는 것)이 가능하다.
function addNum(num1, num2){
console.log(num1+num2)
}
// 함수 호출(사용)
addNum(4,5)
// addNum2(4,5)
// 2. 함수 표현식(function Expressions)
// : 호이스팅이 불가능하다.
let addNum2 = function(num1, num2){
console.log("두번째 함수",num1+num2)
}
addNum2(4,5)
// 3. Arrow function(화살표 함수)
// : ES6 version 지원가능한 함수
// : 호이스팅 불가능하다.
let addNum3 = (num1, num2) => {console.log('화살표 함수',num1+num2)}
addNum3(1,2)
// 매개변수가 하나인 화살표 함수
// : 소괄호 생략 가능하다.
let temp1 = num1 => {console.log('매개변수 하나',num1)}
temp1(4)
// 매개변수가 아무것도 없는 화살표 함수
let temp2 = () => {console.log('비어있는 매개변수')}
temp2()
// 한줄로 작성하는 화살표 함수
// 매개변수가 하나이고 로직도 한줄이라면
// : 중괄호 생략가능하다.
let temp3 = num1 => console.log("한줄로 작성",num1+num1)
temp3(4)
// 함수 수행 후 값을 되돌려주고 시을 때
let temp4 = num1 => {return num1}
console.log(temp4(4))
// 함수 수행 후 값을 되돌려주는데 return 키워드 생략해보기
let temp5 = num1 => num1;
console.log("retunn 생략",temp5(5))
</script>
</body>
</html>
'JavaScript' 카테고리의 다른 글
[JavaScript] 함수를 이용해 두 수의 합 구하기 (0) | 2022.05.27 |
---|---|
[JavaScript] 함수 특징 (0) | 2022.05.27 |
[JavaScript] 과목 입력 후 총 합, 평균 구하기 (0) | 2022.05.27 |
[JavaScript] 배열 (0) | 2022.05.27 |
[JavaScript] 랜덤 수 찾기 (0) | 2022.05.27 |