본문 바로가기

HTML, CSS, javascript/이론

javascript - 기초 (3)

함수(Function)

 - 자바스크립트에서의 함수는 변수에 할당 할수 있으며 인자로 함수를 전달하거나 콜백함수를 구현하는 형태 등 다양하게 함수를 활용할 수 있다.

함수선언

 - function 키워드로 선언하며 인자를 가질 수 있다. 

 - 인자의 매개변수도 타입없이 갯수에 따라 변수명을 나열하고, 함수안에 또다른 함수를 정의할 수 있다.

var count = 0;

myFnc();

function myFnc() {
	count++;
}
document.write(count + "<br>");

선언적 함수

 - 부를 이름을 정하고 명령이 필요할 때 이름을 불러 사용한다.

var fColor = ["red", "blue", "green", "orange"]
var j=0;

function fontColor() {
	j++;
	if(j >= color.length) {
		j = 0;
	};
	var pTag = document.getElementById("theP");
	pTag.style.color = fColor[j]
	console.log(j);
};

익명함수(Anonymous Function)

 - 이름이 없는 함수로 변수에 함수를 구현하거나 함수를 리턴하는 형태가 가능하며 이를 사용해 콜백 함수의 구현이 가능하다.

const num = function () {
	console.log('익명함수 내부의 코드')
};
num();   // 변수에 ()를 붙이면 함수가 실행되는 모드로 변경
        
//크롬 콘솔창
익명함수 내부의 코드                           17.function_2.html:45 
ƒ () {                                        17.function_2.html:48 
	console.log('익명함수 내부의 코드')
}

콜백함수(Callback Function)

 - 이벤트 처리에 많이 사용되며, 이벤트가 발생되었을때 처리될 코드를 익명함수에 넣고 콜백되어 처리될 수 있도록 하는 형식이다.

function add(x, callback) {
    var sum = x+x;
    console.log(sum);
};

add(2, function(num) {
    console.log(num);
});

 

'HTML, CSS, javascript > 이론' 카테고리의 다른 글

javascript - 기초 (2)  (0) 2022.07.05
javascript - 기초 (1)  (0) 2022.07.04
ScrollTop  (0) 2022.06.22
side-menu  (0) 2022.06.22
반응형  (0) 2022.06.16