본문 바로가기
반응형

JavaScript

 (11)
노드의 기능 REPL Read Eval Print Loop $node로 입력해서 >로 바뀌면 자바스크립트 입력 자바스크립트 코드 실행 $node [자바스크립트 파일 경로] 코드 -> 모듈화 (CommonJS 모듈,ECMAScript 모듈) 브라우저의 this와 다른 노드의 this 노드에서 최상위 스코프의 this는 module.exports를 가리킨다. 브라우저에서는 window 객체를 가리킨다. 노드에서 함수 선언문 내부의 this는 global 객체를 가리킨다. 브라우저에서는 window 객체를 가리킨다. 노드의 내장 객체 CommonJS 모듈 require로 모듈 불러오기 module.exports로 모듈 한번에 내보내기 exports 객체로 각각의 변수를 대입하기 exports객체와 module.export..
타입스크립트 제네릭 (+상한 제한) //제네릭 //:클래스나 함수, 인터페이스를 다양한 타입으로 재사용 가능 // -> 실제로 사용할때 타입을 선택할 수 있다. //즉, 특정한 타입을 고정하지 않고 나중에 실제로 사용될 타입을 동적으로 지정 //function getSize(arr):number{ //에러 발생 : 타입을 명시하지 않았기 때문에 // function getSize(arr:number[]):number{ //-> 숫자배열이라고 타입 명시 -> 문자열로도 이 메서드를 쓰고 싶은데? //(1) 함수 오버로드 // 함수 오버로드 정의 function getSize(arr: string[]): number; function getSize(arr: number[]): number; function getSize(arr:number[]..
타입스크립트 클래스 // 클래스 // class Car{ // constructor(color){ // this.color = color; // } // start(){ // console.log("start"); // } // } // const bmw2 = new Car("red"); //자바스크립트에서의 클래스 class Car{ color:string; //1. 멤버변수는 미리 선언해줘야한다. constructor(color:string){ //2. 매개변수 타입 명시 this.color = color; } start(){ console.log("start"); } } const bmw2 = new Car("red"); //타입스크립트에서의 클래스. - 멤버변수 미리 선언하는 방식 class Car2{ constru..
타입스크립트 리터럴, 유니온/교차타입 //리터럴, 유니온/교차타입 //JS 변수 선언 타입 //const : 상수 //let : 변수 const userName1 = "Bob"; //문자열 "Bob"이 타입 - 문자열 리터럴 타입 let userName2:string|number ="Tom"; //문자열이 타입 userName2=3; //숫자도 들어가게 하려면 선언시에 타입을 2개로 명시 //enum과 유사한 타입 type Job = "police" | "developer" | "teacher"; interface User6{ name : string; job : Job; } const user7:User6={ name :"Bob", job: "developer" }; //유니온 타입 interface HighSchoolStudent{ na..
타입스크립트 함수 function add2(num1: number, num2: number):number { console.log(num1+num2); return num1+ num2; } function add3(num1: number, num2: number):void { console.log(num1+num2); } function isAdult2(key:number):boolean{ return age>19; } //인터페이스처럼 함수의 매개변수도 옵셔널로 지정 가능 (optional parameter; 선택적 매개변수) function hello(name?:string){ //function hello(name:string){ return `Hello, ${name||"world"}`; //name이 없으면 wo..
자바스크립트 call, apply, bind (+ 스프레드 연산자, 나머지 매개변수) 함수 호출 방식(어디서, 어떻게)과 관계없이 this 지정하는 방법 : call, apply, bind call(this로 사용할 매개변수, ...매개변수: 호출한 함수에 전달할 매개변수) : 일반적인 함수와 같이 매개변수를 직접 받는다. call에 this로 사용할 객체를 파라미터를 담아서 함수를 호출하면 해당 함수가 주어진 객체의 메서드인 것처럼 사용 가능 즉, call의 첫 번째 매개변수: this로 사용할 값, 그 외의 매개변수 : 호출하는 함수로 전달 (1) this.name이 mike, tom이 됨 (2) update에 this로 사용할 매개변수 mike 전달, 나머지는 호출할 함수로 전달 1999, 'singer apply(this로 사용할 매개변수, 배열 [ ]) : 두 번째 매개변수를 배..
타입스크립트 DOM 타입스크립트는 html파일 내에서 직접 사용 불가 -> 터미널에서 변환 후 첨부 tsc -w -> ts를 js로 컴파일 index.html 안녕하세요 링크 버튼 tsconfig.json { "compilerOptions": { "target": "ES5" ,"module": "commonjs" ,"strictNullChecks": true // ,"strict": true //strict 모든 옵션 } } index.ts //안녕하세요 let 제목 = document.querySelector('#title'); //제목.innerHTML = '반가워요'; //자바스크립트 문법 - union type //: 타입이 명확하지 않기 때문에 (null 가능) //if(제목!=null){ if(제목 instanc..
타입스크립트 인터페이스 (구현과 상속) let user:object; //객체 생성 user ={ name : 'xx', age : 30 } //console.log(user.name); //에러발생 - object에는 특정 속성값에 대한 정보가 없기 때문에 //: 프로퍼티를 사용해 객체를 사용하기 위해서는 인터페이스 사용해야 한다. interface User{ name : string; age : number; gender? : string; readonly birthYear? : number; } let user2 : User={ name : 'xx', age : 30 } let user3 : User={ name : 'xx', age : 30, gender : 'male' } let user4 : User={ name : 'xx', ag..
반응형

티스토리툴바