본문 바로가기

Front-End54

class , 생성자 함수 , 프로토타입 메서드 사실 class는 두개 담은 바구니다.생성자 함수 = 변수만드는 함수(constructor) +프로토타입 메서드 = 만든 변수 가지고 할 함수(protoype method)  생성자함수 : 자바스크립트에서 객체를 만들고 초기화하는 특별한 함수다.생성자함수는 일종의 템플릿으로 , 여러개의 유사한 객체를 쉽게 만들 수 있게 해준다.즉 , "변수집합을 만드는 함수"인 것이다. 생성자 함수 사용법 1 1.대문자로 시작하는 이름 (파스칼케이스)생성자 함수의 이름은 보통 대문자로 시작한다. 2.this 키워드 사용생성자 함수 안에서 'this'라는 키워드는 개로 생성된 객체를 가르킨다. 3.new 키워드와 함께 사용생성자 함수는 'new'키워드와 함께 호출되어야 한다.'new' 키워드를 사용하면 새로운 객체가 생성.. 2024. 7. 19.
타입추론(Type inference) , 타입 명시(Type Annotation) 타입추론 = "타입스크립트가 알아서 해줌"타입명시 = "내가 타입지정함" 타입추론 (Type inference): 타입스크립트가 해당 변수의 타입을 추론하는 방법변수를 선언할 때 타입을 명시하지 않아도 타입스크립트가 할당된 값을 통해 타입을 추론 let num : number = 10; 이렇게 타입을 써줘야하는데, 타입스크립트가 알아서 "아 이건 넘버구나"하고서 추론해주는 거임.그냥 자동으로 파악해주는 게 타입추론임.const num = 10 ; //"10만 올 수 있다."let num = 10; // numberlet으로 선언하면 넘버가 되고,const로 사용하면 "10"이라는 넘버 하나만 된다.다른 것도 마찬가지다.무엇을 변수로 선언했냐에 따라서 타입을 자동으로 추론해준다.일반 변수는 타입추론이 되는.. 2024. 7. 19.
Closer 클로저 : 실행 컨텍스트가 정상적으로 제거(종료)되지 못하는 현상 function outerFunc() { let count = 0; return function innerFunc() { count++; console.log(count); };}const counter = outerFunc();counter();counter();counter();counter();결과 :1,2,3,4  실행할 때마다 1씩 증가한다.원래 자신의 차례가 끝나면 , 콜스택에서 본인은 제거되어야 한다.근데 innerFunc 시점으로 보면, "outerFunc이 자신의 값을 참조하네?"내 값 참조 안하면 버그가 되는데? => 그럼 나 못사라지는데? => 값이 메모리에 남아야겠다.이 현상이 "closer"가 된다... 2024. 7. 19.
깊은 복사,얕은 복사 이 개념은 객체를 복사할 때 사용되는 개념이다. 얕은복사(Shallow Copy)객체의 최상위 레벨만 복사하고, 중첩된 객체는 복사하지 않고 참조를 공유합니다.즉,복사된 객체 내부의 중첩된 객체들은 원본 객체와 동일한 참조를 가진다. 깊은 복사(Deep Copy)객체와 그 객체에 포함된 모든 중첩된 객체들까지 재귀적으로 복사한다.즉, 복사된 객체는 원본과 다른 메모리 주소를 갖게 된다. 원본이 변할 때얕은 복사 : 값이 원본과 같이 변함깊은 복사 : 원본과 다른 주소값을 갖고 있기에 변하지 않음. let a = [1, 2, 3];//이렇게 변수를 냅다 갖다놔버리면 값을 공유함. (얕은 복사)let b = a;let c = [...a];//이렇게 스프레드 연산자로 배열을 없앴다가 다시 놓아주면,//메모리주.. 2024. 7. 19.
함수 함수를 생성하는 방법 중에 익히 쓰는 방법이 두가지가 있다.함수 선언식 , 표현식이다. 함수 선언식은 fuction 함수이름 (){} 이런 형태를 갖는다.function add() {} 함수 표현식은 변수를 선언하고 , 값으로 함수를 넣는 것이다.const add = function () {}; 기명함수 : 함수 선언 시 함수 이름을 명시하는 것보통 함수 선언식에서 많이 사용된다.기명함수 : const add = function add(){}function add() {}  익명함수 : 함수이름을 생략하고 선언하는 것보통 함수 표현식에서 많이 사용된다.익명함수 : const add = function () {}; 매개변수(parameter) : 함수 파라미터 구멍에 들어가는 변수다.(소괄호 안에)func.. 2024. 7. 17.
자료형 , 연산자 자료형,연산자에 대해 배웠다.기본 자료형문자열(String), 숫자(Number), 불린(Boolean), 배열(Array), 객체(Object), 함수(Function), 널(Null), 미정의(Undefined)  참조 자료형배열 객체 함수num = 10e121000000000변수에 지수표기법으로 할당하더라도 , 지수를 10진수를 변환한 10진수의 값으로 본다.     특수자료형(undefined , null)undefinedex) const tvChannel = undefined;nullex) const movieChannel = null;​  undefined는 개발자가 다루지 않고 자바스크립트 엔진이 다루는 값이다.undefined는 값을 할당하고 let numconsole.log(num)원래 .. 2024. 7. 17.