언어공부/JavaScript&jQuery

자바 스크립트(JavaScript) 기초 문법 - 함수(3)

yeony 2021. 7. 29. 13:08

자바 스크립트(JavaScript) 기초 문법

함수

변수에는 데이터만 저장할 수 있고, 코드는 저장할 수 없다. 하지만 함수를 사용하면 코드를 메모리에 저장했다가 필요할 때 마다 호출하여 사용할 수 있다. 

 

객체 생성자 함수

내장 객체를 생성할 때는 이미 자바스크립트 엔진에 내장되어 있는 객체 생성자 함수(Object Constructor Function)를 사용해 객체를 생성한다. 여기서 객체 생성자 함수를 선언하고 그 다음에 객체를 생성할 수 있다.

 

<script>
function 함수명(매개변수1, 매개변수2){//객체 생성자 함수
	this.속성명=새 값;
    this.함수명=function(){
    	자바스크립트 코드;
    }
}

var 참조변수=new 함수명();//객체 생성

function Member(id,pw,name){
	this.memberId = id;
    this.memberPw = pw;
    this.memberName = name;
    
    this.info = function(){    
    	document.write(this.memberId+this.memberPw+this.memberName);
    }
}

var member1=new Member("mem01","01mem","멤버1");
</script>

 

new키워드를 사용해 객체를 생성하고 객체 생성자 함수에서 this 키워드를 사용해 생성한 객체에 속성과 함수를 등록한다.

 

메모리 절약을 위한 프로토타입 사용

객체를 생성하면 객체를 생성한 만큼 함수가 등록된다. 함수를 여러개 등록하면 메모리 공간을 많이 차지하여 메모리를 낭비하게 된다. 이럴 때 객체 생성자 함수에 프로토타입(Prototype, 원형)을 사용하여 함수를 등록하면 메모리 낭비를 줄일 수 있다.

 

프로토타입을 사용하여 등록한 함수는 원형(객체 생성자 함수)에서 생성된 객체를 공유할 수 있어 여러 개의 함수를 등록할 필요가 없다.

 

<script>
function 함수명1(매개변수1, 매개변수2){//객체 생성자 함수
	this.속성명=새 값;
}

함수명1.prototype.함수명2=function(){
    	자바스크립트 코드;
}

</script>

 

내장 함수

자바스크립트 엔진에 내장된 함수를 뜻하며, 내장함수는 개발자가 함수를 직접 선언하지 않아도 되며 바로 호출할 수 있다.

 

종류 설명
encodeURI( ) 문자를 유니코드값으로 인코딩한다. (영문, 숫자, 일부기호 제외)
encodeURIComponent( ) 문자를 유니코드값으로 이코딩한다. (영문, 숫자 제외)
decodeURI( ) 유니코드 값을 디코딩해서 다시 문자화 한다.
decodeURIComponent( ) 유니코드값을 디코딩해 다시 문자화 한다.
parseInt( ) 문자열 데이터를 정수형 데이터로 반환한다.
parseFloat( ) 문자열 데이터를 실수형 데이터로 반환한다.
String( ) 문자형 데이터로 반환한다.
Number( ) 숫자형 데이터로 반환한다.
Boolean( ) 논리형 데이터로 반환한다.
isNaN( ) is Not a Number의 약자로 숫자가 아닌 문자가 포함되어 있으면 true를 반환한다.
eval( ) 문자형 데이터를 따옴표가 없는 자바스크립트 코드로 처리한다.