함수
일련의 처리를 하나로 모아 언제든 호출할 수 있도록 만들어 놓은 것
함수 = 객체
function 함수명 (매개변수) {
처리 로직
return 반환값
}function add(num1, num2) {
result = num1 + num2
return result
}
var add2 = add
//함수가 복사됨
var add = 10
//함수 -> 변수로 변경되어 함수로써 동작하지 않음
값으로서의 함수
함수는 객체이다 - 값이있음, 변수대입가능
- 일등 함수: 변수와 함수를 동등하게 취급
1) 매개변수로 함수 객체를 사용
function outer(callback) {
callback();
}
function inner() {
console.log("이너호출!)
}
outer(inner);
-> 이너호출!2) 반환값으로 함수 객체를 사용
function add(num1) {
return function (num2) {
var result = num1+ num2
return result;
}
}
var add2 = add(10);
add2(20)
-> 30함수 선언문의 끌어올림
함수 객체(실행x) -> 번역(평가) -> 실행 가능 객체(EC- Execution Context) -> 실행
var num0 = 5;
function outer() {
var num1 = 10;
function inner() {
var num2 = 20;
var result = num0 + num1 + num2;
return result;
}
var result = inner();
console.log(result);
}
------------------------------------------
global EC{
변수레코드- window의 하위 속성으로 변수가 정의
window.num0 = 5;
외부 변수 레코드 참조 : null
this 바인딩 : windows 객체의 주소값
}
outer EC{
변수 레코드 객체 {
num1: 10,
}
외부 변수 레코드 참조:
}
inner EC{
변수 레코드 객체 {
num2: 20,
result: 35
}
외부 변수 레코드 참조: outer EC 변수 레코드 주소
this 바인딩 : 호출한 객체의 주소값
}객체간의 상속
상속
: [[Prototype]] : 프로토타입 체인 - 상속 관계 링크
var a = {a: 10, b:20}
var b = {c: 30, d:40}
a.__proto__ = b;
//a객체가 b객체를 상속받음.
a.c
->30
b객체의 정보를 가져올 수 있음.
위 코드에서
a에서 b의 객체 정보를 변경할 수 없지만
b에서 변경할 경우 a에서 접근하는 정보도 변경된다.
변수의 유효범위
- let : 값 변경이 가능 (var와 지역 범위가 다름 중괄호 범위)
let i = 100;
if (true) {
let i =10;
}
i
-> 100- const : 상수 값 변경이 불가능
기본적으로 const, 변경이 필요한 경우만 let
const로 생성한 객체 내부의 내용은 추가, 삭제, 변경이 가능하다.
(외부에서 참조하는 형태이기 때문)
const person = {
name : "이이름",
age : 40
}
person.name = "(수정)이이름"
person.name
->"(수정)이이름"함수 리터럴로 함수 정의하기
const 변수명 = 함수 객체;
this 바인딩
this 바인딩 - this 지역변수 값 결정
this 바인딩 : 호출한 객체의 주소값이 된다.
arguments
arguments - 인수: 매개변수로 사용된 값
parameter - 인자
function sum(a, b) {
console.log('a',a,'b',b);
console.log(arguments);
}
sum(10,20);
->
Arguments(2) [10, 20, callee: ƒ, Symbol(Symbol.iterator): ƒ]
0
:
10
1
:
20매개변수에 투입된 값들이 arguments에 유사 배열의 형태로 저장됨
전개연산자, 나머지 연산자 : ...
값들을 전개할때 사용
function sum(...params) {
console.log(params);
}
undefined
sum(10,20,30,40,50);
->
(5) [10, 20, 30, 40, 50]function add(a, ...params) {
console.log('a',a ,params);
}
add(10,20,30,40,50)
->
a 10 (4) [20, 30, 40, 50]매개변수를 나눠서 사용하는 것도 가능
function add(a, b) {
b= b||10;
console.log('a',a , 'b' , b);
}이런 or 연산자를
function add(a, b = 10) {
console.log('a',a , 'b' , b);
}이렇게 대체도 가능하다.
즉시 실행 함수
: 함수 정의와 동시에 호출
(function(매개변수 정의, ...) {
//실행코드
})(인자 ...);
(function (num1, num2) {
const result = num1 + num2;
return result;
})(10, 20);
->30입력하는 순간 함수가 실행됨
생성자
함수객체 -> 다른객체생산
new 연산자 : 메모리에 공간을 생성 연산자
생성자 함수명
첫 시작 문자 대문자
객체가 생성되는 과정
1.함수 객체에 정의된 prototype 객체의 상속
2.this값을 상속을 받은 객체로 변경함으로써 초기화
function Person() {
name = "이이름";
age = 40;
}
const p1 = {}
p1.__proto__ = Person.prototype
Person.call(p1)
참고) 객체간의 상속
프로토 타입 체인 연결
[[Prototype]] : 프로토타입 체인
간단하게
function Person() {
this.name = "이이름";
this.age = 40;
}
const p1 = new Person();
위의 과정을 진행할 경우 새로운 객체가 생성된다.
