728x90 JavaScript97 [JavaScript] 반복문 for-loop문, 예제 연습 반복문은 조건을 만족하는 동안 코드 블록을 반복적으로 수행한다 for-loop for-loop의 문법구조는 아래와 같다 for (statement 1; statement2; statement3) } //코드 블록 } 더보기 statement1 = 코드 블록이 실행되기 전에 한 번 실행됨 statement2 = 코드 블록을 실행시킬 조건 정의 statement3 = 코드 블록을 실행한 후 실행됨 이 구조를 적용시키면 아래와 같이 쓸 수 있다 for (let i=0; i 2023. 2. 19. [JavaScript] 조건문 if문과 switch문 어떤 특정 조건이 만족할 때만 코드를 실행시키는 문법 조건 만족 = boolean타입으로 참(true)일 때 코드 블록 실행 ! 조건 불만족 (+else문 미작성시) 실행 시키지 않아 아무것도 출력 되지 않음 if 조건문 if(조건식){ // 제일 먼저 조건 체크, 조건을 만족하면 코드 블록 실행, 전체 조건문 빠져나옴 // 실행할 코드 블록 } else if(조건식) { //앞서 작성 된 조건식을 만족하지 않은 경우, 조건을 체크하고 조건을 만족하면 코드 블록 실행 후 전체 조건문 빠져나옴 // 실행 할 코드 블록 } else { // 앞서 작성 된 모든 조건식을 만족하지 않는 경우 무조건 실행되는 코드 블록 //실행 할 코드 블록 } //else if 문은 여러 개 입력 가능 //else 문은 하나만.. 2023. 2. 19. [React] 초기 환경 셋팅, 라이브러리 설치 사전에 미리 node.js가 설치되어 있어야 함 리액트 폴더 생성 npx create-react-app 폴더명 cd 폴더명 npm run strat Router 설치 npm install react-router-dom Sass 설치 npm install node-sass Styled-Component 설치 npm add styled-components 설치 후 package.json에 styled-components 가 추가된 것을 확인. 명령어를 모를 때 npm help package.json 생성 npm init 자잘한 패키지들 모두 설치 npm install antd axios 설치 npm install axios redux 설치 npm install redux express 설치 npm insta.. 2023. 2. 18. [TypeScript] 제네릭(Generic)이란? 제네릭(Generic) ? 재사용 가능한 클래스, 함수를 만들기 위해 다양한 타입에서 사용 가능하도록 하는 것 제네릭이 적용된 대상 (클래스, 함수, 인터페이스)은 선언 시점이 아닌 생성 시점에 사용하는 타입을 결정 제네릭에 사용되는 파라미터는 타입 파라미터라 하며 관용적으로 T를 사용한다 코드를 작성할 때 식별자를 써서 아직 정해지지 않은 타입을 표시한다. 일반적으로 식별자는 T, U, V ...를 사용한다. 필드 이름의 첫 글자를 사용하기도 한다. function getSize(arr:T[]):number{ return arr.length; } const arr1 = [1,2,3]; getSize(arr1); // 3을리턴 //getSize(arr1); //위와 같음 const arr2 = ["a",.. 2023. 2. 17. [TypeScript] call,apply,bind this가 바인딩 되는 객체를 변경하고 싶을 때 call(),apply(),bind()를 사용한다. 1) call() call 메소드는 모든 함수에 사용가능, this를 특정 값으로 지정할 때 쓴다 const green = { name: "green", age: 30 } const blue = { name: "blue", age: 30 } function showName(){ console.log(this.name); } showName(); //this는window //call 메소드는 모든 함수에 사용가능, this를 특정 값으로 지정할 때 쓴다 showName.call(green); //this는 green객체 showName.call(blue); //this는 blue객체 const bella =.. 2023. 2. 16. TypeScript란? 타입스크립트란? TypeScript는 정적 타이핑을 추가하는 JavaScript의 구문 상위 집합 더보기 구문 상위 집합 : JavaScript와 동일한 기본 구문을 공유하지만 무언가를 추가한다는 의미 타입스크립트는 정적 타입개념을 추가한 문법을 제공한다. 에러체크, 자동완성 등 편의성 제공. 우리가 사용하는 브라우져들은 TypeScript를 해석하지 못해서 scss-->css로 변환하여 썼듯이 TypeScript --> JavaScript 컴파일되어 해석, 실행 가능하다. 확장자명은 .ts로 표기한다. 타입스크립트의 장점 1. 버그를 줄이고 유지보수하기 쉬우며 질 좋은 코드 작성에 용이함 2. 강력한 타입으로 대규모 개발에 용이함 3. 자바스크립트 라이브러리와의 편리한 사용 4. 개발 도구에서의 강력한.. 2023. 2. 15. [React] 리액트 state(useState) 리액트 필수 개념 1.state 2. props 3. 컴포넌트 리액트 state에 대해서 알아보자 ! State 화면에 표시하는 데이터나 길이가 변하는 상태 등을 모두 State로 관리한다. 컴포넌트의 상태를 나타내는 값이다. 이벤트가 실행되는 경우 등에 업데이트 처리를 수행함으로써 동적 애플리케이션 구현 useState useState 함수 반환값은 배열 형태로 첫 번째에 State 변수, 두 번째에 그 State를 업데이트하기 위한 함수가 설정됨 useState 사용 예 const [num,setNum] = useState(); 이때 num이 상태를 가진 변수가 되고 setNum이 상태를 업데이트하는 함수가 된다. useState는 함수이므로 사용할 때는 ()를 붙여 함수를 실행한다. 초깃값 설정 c.. 2023. 2. 14. 이전 1 ··· 7 8 9 10 다음 728x90