[JavaScript] 8. 함수

개발자 핑구·2022년 4월 5일

JavaScript 코드메이트

📌 함수란

✅ 함수정의

✅ 함수의 값 반환(return)

✅ 함수를 값으로 사용하기

8.QUIZ

JavaScript[코드메이트]

목록 보기

6/6

📌 함수란

어떠한 기능을하는 코드 덩어리로 함수를 사용하는 이유는 똑같은 코드를 여러 번 작성할 필요가 없기 때문이다.

✅ 함수정의

함수의 이름
매개변수
실행문>

function 함수이름(매개변수1,매개변수2){
  실행문
}

function add(num1,num2){
  document.write(num1+num2);
}

add(1,2);

위에 함수는 add라는 이름을 갖고 num1과 num2를 매개변수로 가지는 함수로
num1+num2의 값을 띄워주는 기능을 하고있다.

✅ 함수의 값 반환(return)

function add(num1,num2){
  return num1+num2;
}
var result=add(1,2);

return구문을 가지는 함수를 변수와 함깨 호출하게되면, 그 변수에는 return구문의 값이 저장된다. 예시에서는 result변수에 3이 저장된다.

✅ 함수를 값으로 사용하기

function multiply(num1, num2){
	return num1 * num2;
}

var multiplyNums = multiply;
document.write(multiplyNums(2,3));

var multiplyNums=multiply; 라고 선언했는데 이는 바로 multiplynums라는 변수에 multiply라는 함수를 저장한 것으로 당장은 사용을 많이 안하지만 추후엔 꽤 자주 사용하게 될것이다.

8.QUIZ

html 코드

<!DOCTYPE html>
<html lang="ko">
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <button onclick=btclick()>전광판 버튼</button>
    <h1 id="printId"></h1>
    <script src="8.js"></script>
  </body>
</html>

javascript코드

var str="코드메이트!";
var lenId=0;
var Id="";

function btclick(){
  if (lenId < str.length){
    var h1=document.getElementById("printId");
    Id+=str[lenId++];
    h1.style.color="#"+Math.round(Math.random()*0xffffff).toString(16);
    h1.innerHTML=Id;
  }
}