View

Javascript ) 함수

Melody:) 2021. 7. 9. 00:11

함수 사용의 예시

<head>
<script>
	function nightAndDayController(self) {
		
	var target = document.querySelector('body');
	
	if(self.value === 'night') {
		target.style.backgroundColor='black';
		target.style.color='white';
		self.value = 'day';
		
		var alist = document.querySelectorAll('a');
		var i = 0;
		while (i < alist.length) {
		    console.log(alist[i]);
		    alist[i].style.color = 'powderblue';
		    i = i + 1;
		}
	}
	else {
		target.style.backgroundColor='white';
		target.style.color ='black';
		self.value = 'night';
		 
		var alist = document.querySelectorAll('a');
		var i = 0;
		while (i < alist.length) {
		    console.log(alist[i]);
		    alist[i].style.color = 'blue';
		    i = i + 1;
		}   
	 }
	}
</script>
</head>
<body>


<input type="button" value="night" id="night_day" onclick="
		nightAndDayController(this);
	">
<input type="button" value="day" id="night_day" onclick="
		nightAndDayController(this);
	">
</body>

함수 : 매개변수와 인자

<script>
function sum (left,right) {
	document.write(left + right+'<br>');
}
</script>

sum(2,3);
sum(3,4);

sum()안의 2와 3은 인자(Argument)이며,

이들의 값을 받는 함수 안의 left, right는 매개변수(Parameter)라 한다.

 

함수 (리턴)

[return 사용 전]

<script>
function sumColorRed (left,right) {
	document.write('<div style="color:red">'+ left + right+'</div><br>');
	
}
sumColorRed(2,3);
sumColorRed(3,4);
</script>

[return 사용 후]

더해진 결과를 다양한 방법(글씨 효과 다양하게)으로 사용하고 싶을 때 return 사용

<script>
function sum2 (left,right) {
	//  return 사용
	return left + right;
}
document.write('<div style="color:red">' + sum2(2,3)+'</div><br>');
document.write('<div style="color:red">' + sum2(3,4)+'</div><br>');
</script>

 

'JAVASCRIPT' 카테고리의 다른 글

JQUERY) libraryVS framework  (0) 2021.07.09
Javascript) File  (0) 2021.07.09
JAVASCRIPT) 객체  (0) 2021.07.09
JAVASCRIPT) 비교연산자와 블리언  (0) 2021.07.08
JAVASCRIPT의 이해  (0) 2021.07.07
Share Link
reply
«   2024/10   »
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31