클래스 컴포넌트import React from 'react'// props 타입 선언interface Props { required?: boolean text: string}// state 타입 선언interface State { count: number isLimited?: boolean}class Component extends React.Component { private constructor(props : Props) { super(props) this.state = { count: 0, isLimited: false, } } render() { const { props: {required, t..
함수란작업을 수행하거나 값을 계산하는 등의 과정을 표현하고 이를 하나의 블록으로 감싸서 실행 단위로 만들어 놓은 것리액트에서 컴포넌트를 만드는 함수도 자바스크립트 함수의 기초적인 형태를 따름자바스크립트에서 함수는 다른 함수의 매개변수가 될 수 있고, 반환값이 될 수 있으며, 할당도 가능하므로 일급 객체임 함수를 정의하는 방법함수 선언문가장 일반적으로 사용하는 방식표현식이 아닌 일반 문으로 분류됨function add(a,b) { return a + b;}함수 표현식함수를 변수에 할당해 표현하는 방식할당하려는 함수의 이름을 생략하는 것이 일방적const sum = function (a,b) { return a + b;}sum(10, 24) 함수 선언문함수 표현식호이스팅으로 인해 함수 선언문은 먼저 메모..
일급 객체 조건 무명의 리터럴로 생성할 수 있음. 즉, 런타임에 생성 가능함 변수나 자료구조에 저장가능 함수의 매개변수에 전달가능 함수의 반환값으로 사용가능 일급 객체 함수는 일급 객체의 조건을 모두 만족하므로 일급 객체임 함수를 객체와 동일하게 사용할 수 있다는 의미 객체는 값으미로 함수는 값과 동일하게 취급 가능 함수는 값을 사용할 수 있는 곳(변수 할당문, 객체의 프로퍼티 값, 배열의 요소, 함수 호출의 인수, 함수 반환문)이라면 어디서든 리터럴로 정의 가능하며 런타임에 함수 객체로 평가됨 가장 큰 특징은 일반 객체와 같이 함수의 매개변수에 전달 가능하며 함수의 반환값으로 사용할 수 있다는 것 하지만, 일반 객체와 달리 함수 객체는 호출할 수 있고 함수 고유의 프로퍼티를 소유함 // 1. 함수는 무..
Object 생성자 함수 new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환함 빈 객체에 프로퍼티 또는 메서드를 추가해 객체 완성할 수 있음 인스턴스를 생성하는 것은 필수이고, 생성된 인스턴스를 초기화하는 것은 옵션임 const person = new Object(); 생성자 함수 new 연산자와 함께 호출하여 객체(인스턴스)를 생성하는 함수 생성자 함수에 의해 생성된 객체를 인스턴스 라고 함 String, Number, Boolean, Function, Array, Date, RegExp, Promise 등이 있음 반드시 생성자 함수를 사용해 빈 객체를 생성해야 하는 것은 아님 객체 리터럴에 의한 객체 생성 방식의 문제점과 생성자 함수에 의한 객체 생성 방식의 장점 객체 ..
함수일련의 과정을 문으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것입력을 받아서 출력을 내보냄특정 함수를 구별하기 위해 식별자인 함수 이름 사용 가능인수 (argument) : 입력값매개변수 (parameter) : 함수 내부로 입력을 전달받는 변수반환값 (return value) : 출력값function add(x,y) { //x,y는 매개변수 return x+y; //x+y는 반환값}add(2,5) //2,5는 인수 함수 정의함수를 호출하기 이전에 인수를 전달받을 매개변수와 실행할 문들, 그리고 반환할 값을 지정하는 것정의된 함수는 자바스크립트 엔진에 의해 평가되어 함수 객체가 됨함수 정의만으로 함수가 실행되는 것은 아님함수 정의 방식함수 선언문함수 표현식Function 생성자 ..
명시적 this this 타입을 지정해 주지 않으면 자동으로 any가 됨 typescript에서는 any를 지양해야 함 interface Cat { name : string age : number } const cat : Cat ={ name : 'kitty', age : 3 } function hello(this: Cat, message : string) { console.log(`Hello ${this.name}, ${message}`) } hello.call(cat, 'You are sooooo cute!'); 오버로딩 function add(a:string, b:string) : string //타입 선언 function add(a:number, b:number) : number //타입 선언 f..
함수(Fuction) 함수 선언문(Declaration) function hello() {} 함수 표현식(Expression) const Hello = function() {} 호이스팅(Hoisting) 코드 상단에서 선언된 함수를 호출하는 것 함수 선언문으로 작성한 함수는 코드 내 선언부 상단에서 함수를 호이스팅하는 것이 가능하지만 함수 표현식으로 작성된 함수는 불가능하다. 나머지 매개변수 function sum(...rest) { return rest.reduce(function(acc,cur) { //배열 내 원소들을 더하고 더한 원소는 삭제하는 코드 return acc + cur }, 0 } sum(1,2) //3 sum(1,2,3,4,5) javascipt는 모든 매개변수의 정보를 가지고 있는 ..