타입스크립트 = 제네릭 : 일반적인
스택,큐
둘다 뒤에서 넣지만 어떻게 꺼내는가
push,shift,unshift,pop( 원본 배열 변경)
push리턴값
unshift pop
[1,2,3]
unshift push
push와 unshift의 대용품
push 대용품 = [...todos, {-}] = todos.concat({-})
unshift 대용품 {{}...todos} = [{}].concat(todos)
pop의 대용품 arr.[length-1]
unshift = arr[0]
정적인 언어에서의 배열은
int arr[4]
4바이트 1000,1004,1008,1012 이런식으로 있어서 아무리 큰배열이라도 O(1)로찾아간다.
자바스크립트에서 배열은 따라만했을뿐 어떤값이 들어올지 모를경우
arr[4]
링크드 리스트로 연결되어있어서 , 갯수에 따라 달라진다
사용성을 좋게하기 위해서 성능을 포기함
배열이라고 하지만 배열이 아니라 느리다 -> 타입이 동일한 요소로 배열을 만들면 원래처럼돈다
->es6, typearray 등장
Queue<T> 타입매개변수
타입을 만드는 법 (인터페이스) = 다양함
interface User {
name:string; 반드시
age?: number; 옵션
} 임플리맨츠할수 있음 제일나음
type User = {
name: string;
age?: number;
} 순수하게 타입만
class User{
name:string;
age:number;
} 비추
이벤트 에미터 : 이벤트를 강제로 발생시켜서 부모컴포넌트에 값을 담아서 이벤트를 보냄
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡangular
템플릿(제일중요한 템플릿,데이터 바인딩)
html 비스무리한것들 (사실은 문자열이다) , 템플릿 문법이 존재 {{}} (click)="" [~]=""
템플릿 문법은 html의 문법을 고대로쓸수있고, 추가적으로 템플릿문법을 쓸 수 있다
->컴파일되서 뷰를 만든다
템플릿이 주도해서 필요할때 컴포넌트에서 가져와서 (표현식)을 가져와서 평가한다
MVW (모델,뷰는 반드시있고 나머지는 모든지 올 수 있다)
뷰는 걸국 돔이다. 상태변화는 돔에서 감지해서, 뷰를 거쳐 MODEL에 가서 상태를 변화시키고
VIEW로 갔다가 DOM으로 간다
변화감지: 계속 보고 있다가, 변화가 감지되면 ,템플릿에 업데이트
(그전에는 랜더함수를 호출했었음)
템플릿 문법은 ,HTML문법과 템플릿 문법으로 이루어져있는데
그중 temple문법에는
데이터바인딩,빌트인 디렉티브, 빌트인 구조디렉티브, 템플릿 참조변수, 템플릿 표현식 연산자
등 5가지가 있다
->템플릿 내에서 금지요소 script, 자바스크립트가 해야될 일(대입, 증감,) 값 변경 -> 컴포넌트 클래스에서, 전역 스코프를 갖는 빌트인 객체
기존의 방식은 html의 '구조'를 알아야한다
뷰에서 데이터가 바뀌었을떄, (이벤트발생!)
컴포넌트에 데이터가 바뀌었을떄(별로없다) 몽키패치로 감시?
react (dom 갱신에 강점을 가진 라이브러리)
angular 프레임워크
데이터바인딩
인터폴레이션 {{}}
프로퍼티 바인딩 (컴포넌트간 송신)[] = ""
어트리뷰트 바인딩(꼭써야할 타이밍이있다)
클래스바인딩(클래스를 추가할것이냐 말것이냐)
스타일바인딩(스타일이 추가할것이냐 말것이냐)
인터폴레이션{{expression}}
->클래스 컴포넌트에 있는 실행 가능한 expression
->없으면 안찍는다
프로퍼티 바인딩
innerHtml (요소의 프로퍼티)
자바스크립트에서 document.querySelector('...')innerHTML <프로퍼티다 ,프로퍼티에 값할당
document.querySelector('...')innerHTML 값 참조
어트리뷰트(직접 HTML안에 있는것?) setattribute , 초기값, 안바뀜,바뀌면 안되는애
어트리부트는 이 요소가 초기평가될 요소(리로드)
그이후에 유저가 입력하면 , 어트리뷰트랑 별개고 프로퍼티에만 영향을준다
프로퍼티 : 바뀜, 최신상태, 바꿔야될값 최신상태가 필요할떈 프로퍼티
attr.value (프로퍼티가 아니고 어트리뷰트다)
프로퍼티바인딩
<element [property]="expression">...</element>
어트리뷰트바인딩
어트리뷰트 ,프로퍼티의 대응관계
id어트리뷰트가 있으면 id프로퍼티랑 1:1매핑된다
class어트리뷰트는, class 프로퍼티는 없다, classList, className (여러개 있을 수 있잖아)
td의 colspan 어트리뷰트는 프로퍼티가 존재하지 않는다 ->프로퍼티 바인딩 못한다
textContent 프로퍼티의 경우, 어트리뷰트 존재 x
input요소의 value어트리뷰트와 value프로퍼티는 1:1매핑되지만 다르게 동작
어트리뷰트 바인딩을 할까 프로퍼티 바인딩을할까 고민할때, 어떤 관계가 있는지를 먼저 구분해야된다
클래스바인딩
여러개 할때는 ngClass를 쓰는게 편리하다
스타일바인딩
프로퍼티이름
단위가 있는 애들은 프로퍼티스타일.단위 ="'64'"
이벤트바인딩
소괄호 (clcik) ="함수호출문"
양방향 데이터 바인딩 (그렇게 추천하진 않는다)
[(ngModel)]
ngfor (템플릿에서 포문을 돌리는것)