겉바속촉

[html] 자바스크립트-함수 본문

IT일기(하반기)/HTML

[html] 자바스크립트-함수

겉바속촉 2020. 6. 11. 15:19
728x90
반응형

우선 함수의 종류에 대해서 알아보도록 할게요:)

 

 

1. 파라메타 와 리턴값이 없는함수
  function 함수이름() {

}

2. 파라메타 만 있고 리턴값이 없는함수
  function 함수이름(pa1,pa2){
 
  }
 
3. 파라메타 와 리턴값이 있는함수
  function 함수이름(pa1,pa2){
  return 반환값;
  }
 

함수명 형태에 따른 분류

 

1. 가장 기본적인 함수 
  function hello(){

         document.write("자바스크립트 시작~");

}

hello();

 

2. 리터럴 방식-->함수명=function 형태

 

hello2= Function(){

         document.write("리터럴 방식 함수 만들기");

}

hello2();

 

3. 이름없는함수...주로 어떤 내용을 외부와 완전히 분리시킬때

(function(){

          document.write("이름없는 함수랍니다");

})();

 

 

 

 

다음과 같이 코드를 우선 작성해주세요:)

저는 showName이라는 함수를 만들어주었는데요

나중에 입력받는 값을 넣어주었습니다

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<script type="text/javascript">

function showName(name) {
	document.write("안녕하세요&nbsp "+name+"님 JS수업 시작합시다<br>");	
}

showName("유재석");
showName("정지훈");
showName("이효리");

</script>
</head>
<body>

</body>
</html>

 

 

이번에는 다음과 같이 list사용해서 또 출력해보도록할게요:)

window.onload=function()
{
	var list='';
	
	list+='<ul>';
	list+='<li>Hello</li>';
	list+='<li>JavaScript</li>';
	list+='</ul>';
	
	document.write(list);
	}

document.write말고도 document.body.innerHTML=list; 이렇게 적으셔도

결과창은 동일합니다:)

 

다음과 같이 또 코드를 작성해주세요

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
<script type="text/javascript">

/* 함수명: showInfo \
 * 
 파라메타: 이름, 나이
 안녕하세요
 이수연님의 나이는 45입니다
 안녕하세요
 홍길동님의 나이는 33입니다
 */
 
 function showInfo(name,age)
 {
	 document.write
	 ("안녕하세요<br>"+name+"님의 나이는 "+age+"세입니다<br>");
 }

showInfo("보라돌이",12);
showInfo("뚜비",10);

</script>
</head>
<body>

</body>
</html>

 

컴파일하신 후에 다음과 같다면 성공!^^!

 

728x90
반응형
저작자표시 비영리 변경금지

'IT일기(하반기) > HTML' 카테고리의 다른 글

[html] 자바스크립트-수강신청  (0) 2020.06.11
[html]자바스크립트-함수불러오기  (0) 2020.06.11
[html] 자바스크립트-형변환  (0) 2020.06.11
[html] 자동완성 설치하기  (0) 2020.06.11
[html] Audio랑 Video 넣어보기  (0) 2020.06.11
'IT일기(하반기)/HTML' Related Articles more