개발 기록 남기기✍️

이 카테고리는 모던 자바스크립트 Deep Dive 책을 공부하며 정리한 글을 포스팅하는 공간입니다. 5.1 값 값 : 식(표현식)이 평가되어 생성된 결과를 말한다. 평가 : 식을 해석해서 값을 생성하거나 참조하는 것을 의미한다. // 변수에는 10 + 20이 평가되어 생성된 숫자 값 30이 할당된다. var sum = 10 + 20; // 30 모든 값은 데이터 타입을 가지며, 메모리에 저장된 값은 데이터 타임에 따라 다르게 해석될 수 있다. sum 변수에 할당되는 것은 10 + 20이 아니라 평가된 결과인 숫자 값 30이다. 따라서 10 + 20은 할당 이전에 평가되어 값을 생성해야 한다. 5.2 리터럴 리터럴 : 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법 리터럴 예시..

이 카테고리는 모던 자바스크립트 Deep Dive 책을 공부하며 글을 정리한 포스팅하는 공간입니다. 1 프로그래밍 1.1 프로그래밍이란? 프로그래밍이란 컴퓨터에게 실행을 요구하는 일종의 커뮤니케이션이다. 0과 1로 이루어진 바이너리 코드만 아는 기계가 실행할 수 있을 정도로 정확하고 상세하게 요구사항을 코드로 설명하는 작업이다. 이 때 필요한 것이 컴퓨터의 입장에서 문제를 바라보는 컴퓨팅 사고이다. 예를 들어, 사람은 소리의 크기를 "크다" 또는 "작다"로 표현한다. 하지만 이는 상대적인 개념으로 기준이 불명확하다. 컴퓨터에게는 양적 개념인 숫자를 사용해서 "볼륨을 60으로 조정해라"라고 명령해야 한다. 1.1 프로그래밍 언어 문제 해결 명령을 수행할 주체는 컴퓨터이기 때문에 자연어가 아닌 기계어로 명령..

[강의로 이동](https://nomadcoders.co/typescript-for-beginners) vscode에서 환경 셋팅하기 typescript 설치하기 package.json 초기화 npm init -y typescript 설치 npm i -D typescript tsconfig.json 설정디렉터리에 tsconfig.json 파일이 있으면 해당 디렉터리가 typescript 프로젝트의 루트임을 나타낸다. tsconfig.json 파일은 프로젝트를 컴파일하는 데 필요한 루트 파일과 컴파일러 옵션을 지정한다. MAC : touch tsconfig.json Window : code tsconfig.json // 이후 ctrl+S (저장) package.json에 작성 // "main" 코드 삭제 ..

[강의로 이동](https://nomadcoders.co/typescript-for-beginners) Classes abstract class User { constructor ( private firstName : string, private lastName : string, protected nickname : string ){} abstract getNickName() : void getFullName(){ return `${this.firstName} ${this.lastName}` } } class Player extends User { getNickName(){ console.log(this.nickname); } } const sun = new Player("sun", "yoo", "너해동..

[강의로 이동](https://nomadcoders.co/typescript-for-beginners) Call Signatures 프로퍼티로 호출 가능한 것을 설명하려면 객체 타입에 Call Signature을 작성할 수 있다. Call Signatures는 다음과 같이 함수의 매개변수와 반환 타입을 type으로 미리 선언한다. React.js를 사용할 때, props로 함수를 보내게 되면, 어떻게 함수가 작동하는지 타입스크립트한테 설명해줘야 한다. type Add = { (a : number, b: number) : number; } // type Add = (a : number, b: number) => number; const add : Add = (a, b) => a + b; Overloadin..

[강의로 이동](https://nomadcoders.co/typescript-for-beginners) 왜 Typescript인가? Typescript는 타입 안정성을 가진다. 코드에 버그가 줄어들게 되며, 런타임 에러가 줄어들고 생산성도 늘어난다. 런타임 에러 : 콘솔 안에서 일어나는 에러 Javascript는 매우 유연한 언어이다. 개발자를 이해하려고 해서 아무리 이상한 코드라고 해도 에러를 보여주지 않으려고 한다. [1,2,3,4] + false -> '1,2,3,4false' function divide(a,b){ return a / b }; divide(2,2); // 1 divide("xxxxx"); // NaN Javascript는 함수를 올바르게 사용하도록 강제하지 않는다. 매개변수의 타입..

이번 포스트도 역시나 코딩앙마님의 강의를 보고 작성했습니다. [자바스크립트 중급 강좌 : 140분 완성 - YouTube](https://www.youtube.com/watch?v=4_WLS9Lj6n4&t=5204s) 1. Class class는 ES6에 추가된 스펙이다. const User = function(name, age){ this.name = name; this.age = age; this.showName = function(){ console.log(this.name); }; }; const mike = new User("Mike", 30); console.log(mike); // User{name : "Mike", age: 30, showName()}; // Class 사용 class Us..

이번 포스트도 역시나 코딩앙마님의 강의를 보고 작성했습니다. [자바스크립트 중급 강좌 : 140분 완성 - YouTube](https://www.youtube.com/watch?v=4_WLS9Lj6n4&t=5204s) 1. setTimeout / setInterval setTimeout 일정 시간이 지난 후에 함수를 실행한다. setInterval 일정 시간 간격으로 함수를 반복한다. function fn(){ console.log(3) }; setTimeout(fn, 3000); setTimeout(function(){console.log(3)},3000); // 3초 뒤에 console 창에 3 띄 clearTimeout(함수) 예정된 setTimeout 함수를 취소한다. clearInterval(함..

이번 포스트도 역시나 코딩앙마님의 강의를 보고 작성했습니다. [자바스크립트 중급 강좌 : 140분 완성 - YouTube](https://www.youtube.com/watch?v=4_WLS9Lj6n4&t=5204s) 1. 구조 분해 할당 구조 분해 할당 배열이나 객체의 속성을 분해해서 그 값을 변수에 담을 수 있게 하는 표현식 let users = ["Mike","Tom"]; // let user1 = users[0]; // let user2 = users[1]; let [user1, user2] = users; console.log(user1); // "Mike" console.log(user2); // "Tom" let str = "Mike-Tom-Jane"; let [usr1, usr2, usr3..

이번 포스트도 역시나 코딩앙마님의 강의를 보고 작성했습니다. https://www.youtube.com/watch?v=4_WLS9Lj6n4&t=5204s 1. 문자열 Method ✔️ html 코드를 감쌀 때는 작은 따옴표로 감싸고 안에 class나 id 같은 속성값은 큰 따옴표로 감싸는게 낫다. ✔️영어 문장은 큰 따옴표로 감싸는게 낫다. ✔️백틱을 사용하면 여러 줄의 문장 표현이 가능하다. str.length 문자열의 길이를 보여준다. str[n] 문자열의 n번째 위치를 보여준다. 배열이나 객체와는 달리 글자를 바꿀 수는 없다. toUpperCase() / toLowerCase 영문자를 모두 대문자화 / 소문자화 str.indexOf(text) 해당 text가 문자열 중 몇 번째에 위치하는지를 파악한..