자바스크립트/함수 (7) 썸네일형 리스트형 [자바스크립트] - 프로토타입(prototype) 프로토타입(prototype) :엄마 유전자 같은 객체 생성자 함수를 선언하여 객체를 생성하고 속성과 함수를 등록하여 사용할 때 앞에서 배운 내용대로 매서드를 사용하면 객체를 생성한만큼 함수가 등록된다. 그리고 함수를 여러 개 등록하면 메모리 공간을 많이 차지하여 메모리를 낭비하게 된다. 이럴 때 객체 생성자 함수에 프로토타입을 사용하여 함수를 등록하면 메모리 낭비를 줄일 수 있다. 프로토타입의 사전적인 의미는 '원형'이다. 즉, '원래의 형태(=유전자)'를 뜻한다. 프로토 타입을 사용하여 함수를 등록하면 함수는 유전자(프로토타입)에서 생성된 객체를 공유할 수 있다. 즉, 여러 개의 함수를 등록할 필요가 없다. 객체를 생성한 만큼 함수가 등록되는 게 아니라 부모님 안에서 유전으로 가져다쓸 수 있는.. [자바스크립트] - 객체 생성자 함수 객체 생성자 함수(Object Contructor Function) (퍼블리셔보다는 프론트앤드가 사용) 내장객체를 생성할 때는 이미 자바스크립트 엔진에 내장되어 있는 객체 생성자 함수를 사용해서 객체를 생성한다. const 변수를 사용하면 재선언, 재할당이 안되니깐 더 안전하다.중요한 내용이면 const를 쓰자. 여기서 this 키워드는 생성한 함수, 생성된 객체를 가리킴 객체 생성자 함수의 이름의 첫글자는 대문자로 쓰는 것이 관례이다.(오류가 나진 않는다) [기본형]function 함수명(매개변수1, 매개변수2..){ this.속성명 = 새 값; this.함수명 = function(){ 자바스크립트 코드; }}let 참조변수 = new 함수명(); -> 객체 생성자 함수 .. [자바스크립트] - ★화살표 함수 화살표 함수 Arrow function ES6버전부터는 => 표기법(화살표 표기법)을 사용해서 함수 선언을 좀 더 간결하게 할 수 있다. 화살표 함수는 익명 함수에서만 사용할 수 있다. 화살표 함수가 적응되면 익명함수보다 화살표 함수로 많이 쓴다. 익명함수 기본형에서 function 글자가 사라지고 매개변수 자리 뒤에 => 가 추가된 형태[기본형]0.매개변수가 2개 이상 있을 경우let 변수 = (매개변수1, 매개변수2) => { 자바스크립트 코드 }; 변수명(인수); → 호출문 1. 매개변수가 없을 경우: 매개변수의 괄호 안을 비워두면 된다. 호출문의 인수자리도 비워둔다.let 변수 = () => { 자바스크립트 코드 };변수명()); → 호출문2. 실행할 자바스크립트 코드가 1줄인 경.. [자바스크립트] -함수 표현식 > 익명함수, 즉시실행함수 함수표현식 일반 함수 정의문의 경우 함수명을 선언하고 그 이름을 사용해서 호출한다. 이 방법은 함수 이름만 알고 있으면 어디서나 함수를 실행할 수 있어서 많이 사용한다. 이 밖에 함수 이름을 지정하지 않고 사용하거나, 함수를 호출하지 않고 바로 실행하는 함수도 있다.함수 중 1. 익명함수나 2. 즉시실행함수를 모두 함수 표현식이라고 한다. 1. 익명함수 익명함수는 이름이 없는 함수를 말한다. 익명함수를 선언할 때에는 이름을 붙이지 않는다. 변수에 넣어 사용하기 때문에 익명함수를 호출할 때에는 변수명을 이용해 호출할 수 있다. 일회용 기능들을 익명함수로 많이 쓴다. 호이스팅 X 재사용 O [기본형]let 변수명 = function(){ 자바스크립트 코드;} 변수명(); .. [자바스크립트]- 함수의 호이스팅 / 스코프(함수의 유효범위) 일반함수의 호이스팅 일반 함수 정의문(=이름이 있는 함수)의 경우 호이스팅 기능을 지원한다. 함수의 호이스팅은 함수 정의문보다 함수 호출문이 먼저 등장하더라도 해당 함수를 정상적으로 실행하는 것을 말한다. 일반 함수가 정의되면 자바스크립트 엔진 메모리 공간 안에 함수의 이름을 이용해 미리 저장해둔다. 저장된 일반 함수는 해당 함수보다 호출문이 먼저 등장하더라도 호이스팅에 의해 정상 실행이 된다. 하지만 익명함수 즉, 이름이 없는 함수의 경우 호이스팅 기능이 적용되지 않는다. 그렇기 때문에 함수정의가 먼저 이루어진 다음 그 후에 함수 호출문이 등장해야 함수가 실행된다. 기계보다 버튼이 먼저 눌러지더라도 기계가 정상 작동된다. 함수들을 한꺼번에 모아서 맨 위나 아래에 모아놓고 호이스팅 기능으로 버.. [자바스크립트] - 재귀 함수 호출 재귀 함수 호출 함수 정의문 내에서 작성한 코드로 함수를 다시 호출하는 것을 재귀 함수 호출이라고 한다. 재귀 함수 호출은 반복문처럼 여러 번 호출하기 위해 사용한다. [기본형] function 함수명(){ 자바스크립트 코드; 함수명(); let num = 0; function testFnc() { num++; document.write(num, ""); if (num == 10) return; //num이 10이 되면 함수 종료. 10이 되기 전까진 if문이 실행되지 않는다. testFnc(); //바깥에 함수 호출문이 실행되면 안족의 함수 호출을 실행 } testFnc(); .. [자바스크립트] - 함수 > 일반 함수 정의문, 익명 함수 함수 function 함수는 숫자를 담는 상자라는 뜻으로, 어떠한 데이터를 넣으면 함수에 들어있는 여러 코드를 통해 원하는 결과값을 반환하게 만들어주는 코드이다. 예를 들면 사과, 오렌지 파인애플같은 데이터를 넣으면 함수라는 공장에서 여러가지 첨가물이나 공정과정으로 통해 '주스'라는 결과값을 만들어주는 기능을 뜻한다. 함수는 공장, 기계로 버튼을 눌러주면 실행되는 기계라고 생각하면 쉽다. 함수의 장점은 함수를 하나 만들어두면 여러 번 재사용을 할 수 있다는 큰 장점이 있다. 매번 같은 코드를 새로 작업하지 않아도 함수를 호출만 해주면 여러 번 같은 코드를 반복 사용할 수 있다. *만들었다고 바로 실행하는 게 아니라 호출해줘야지 실행한다* 함수는 크게 '일반 함수 정의문'과 '익명함수'로 나누어진다... 이전 1 다음