NOW OR NEVER

Async 비동기 프로그래밍 관련 단어 hoisting : var 변수 선언과 function declaration 함수 선언들이 자동적으로 제일 위로 올라가는 것 callback 함수 : 전달한 함수를 나중에 불러줘 라는 개념, 보통 arrow function 형식으로 작성 1000 ms : 1초 1. 동기와 비동기 synchronous : 정해진 순서(작성한 순서)에 맞게 코드가 실행되는 것 Javascript is synchronous 자바스크립트는 동기적이다. Executing the code block in order after hoisting : hoisting이 된 이후부터 코드가 작성한 순서대로 하나 하나씩 동기적으로 실행된다(나타나는 순서대로 자동적으로 실행됨) javascript 엔진은..

JSON(Javascript Object Notation) HTTP(HYpertext Transfer Protocal) hypertext : 웹사이트에서 이용되어지고 있는 hyper links만 이야기하는 것이 아니라 전반적으로 쓰여지고 있는 resource들, 문서나 이미지 파일들 등을 다 포함해서 말한다. 어떻게 hypertext를 서로 주고 받을 수 있는지를 규약한 protocal의 하나 브라우저에서 동작하고 있는 웹사이트나 웹 어플리케이션과 같은 client들이 어떻게 Server와 통신할 수 있는지를 정의한 것 client가 server에게 data를 request(요청) 할 수 있고 server는 client가 요청한 것에 따라서 그에 맞는 response(응답)을 client에게 보내주는 방..

Array APIs 1. join arrayName.join('seperator'); join(separator?: string): string; 배열에 있는 모든 아이템들을 문자를 통해서 각각 구분자(seperator)를 넣어 더해서 seperator string으로 return ? 뜻은 전달해도 되고 안해도 된다는 뜻, 즉 seperator은 넣어도 되고 안넣어도 되는데 안넣게 되면 구분자는 ,로 들어가게 됨 2. split arrayName.split('seperator', limit); split(separator: string | RegExp, limit?: number): string[]; seperator과 limit 총 두가지의 parameter을 받음 seperator 필수 작성 stri..

Array 배열 자료 구조란? 일상생활에서 비슷한 것들만 모아서 각 바구니에 모아놓는 것처럼 프로그래밍 언어에서도 비슷한 종류의 데이터들을 묶어서 한 곳에다가 보관해놓는 것들을 자료구조라고 한다. 자료구조에는 어떤 방식으로, 어떤 형식으로 데이터를 담느냐에 따라서 굉장히 다양한 타입들이 있다. object와 자료구조의 차이점 object는 서로 연관된 특징과 또는 행동들을 묶어놓는 것을 말한다. 자료구조는 비슷한 type의 objec들을 묶어놓는 것을 말한다. js가 아닌 다른 언어에서는 보통 자료구조에는 동일한 type의 object를 담을 수만 있다. 즉 type이 있는 언어에서는 동일한 type의 데이터만 담을 수 있다. js는 dynamically typed language이기에 type이 동적으..

Object https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object 어떤 데이터가 들어갈 수 있는지 정의를 하고 선언된 틀인 class를 이용해서 실제로 데이터를 넣어서 만드는 것이 object이다. instance of a class : class를 이용해서 새로운 instance 생성시 object가 됨 created many times : object는 class를 이용해서 굉장히 많이 만들 수 있다. data in : class에 실제로 데이터를 넣으면 object가 되어 메모리에 올라가게 됨 붕어빵 틀인 class에 팥이라는 data를 넣으면 팥붕어빵이 되고, cream data를 넣으면 크림붕어빵이..

객체 지향 언어(Class vs Object) class를 이용해서 상속과 다양성이 일어날 수 있다. 이런 모든 것들이 일어날 수 있는 곳이 객체지향 언어이다. 객체 지향 언어로 프로그래밍을 잘하는 개발자 = 풀어야 하는 문제나 구현해야 되는 기능들을 객체로 잘 정의해서 만들 수 있는 개발자 js에 class나 object가 없다면 정의한 변수들이 여기저기에 둥둥 떠다니면서 규모있는 프로젝트를 만들기 힘들었을 것이다. 실제로 살아가는 세상에는 수많은 물체와 사물들이 존재한다. 프로그래밍을 할 때 또한 사물과 물체들을 class나 object로 정의해서 프로그래밍 하는 것이 조금 더 자연스럽기 때문에 개발자들이 편하고 유연하게 프로그래밍을 할 수 있게 도와준다. 상속 Inheriance class 상속받을..

Functions 함수 function : 프로그램 안에서 각각의 작은 기능들을 수행하는 것, 즉 프로그램을 구성하는 굉장히 기본적인 building block 프로그램 안에서 각각 저마다 기능을 진행하는 함수들 존재, 이런 절차적인 언어같은 경우 함수가 프로그램에서 굉장히 중요한 기능을 담당하고 있어 sub-program이라 불리기도 한다. 또한 함수는 여러번 재사용이 가능하다는 강점이 있다. 대체적으로 function은 한가지의 task나 어떠한 값을 계산하기 위해 쓰여진다. 추가된 class의 경우에도 java 처럼 pure한 oriented가 아니라 prototype을 베이스로한 가짜의 object oriented 이므로 자바스크립트도 procedural language(절차적인 언어)라고 볼 수..

연산, 반복문 1. String concatenation 문자열 + 문자열 = 새로운 문자열 숫자로 된 문자열('1') + 숫자 = 숫자 ` `을 활용한 string literals, ${}을 함께 이용하면 변수 값을 계산해서 string으로 포함해 문자열을 만들 수 있다. 줄을 바꾸거나 특수문자인 single quote(' ') 등을 이용해도 고대로 문자열로 변환되서 나온다 single quote(' ') 문자열 만들 경우 중간에 single quote나 특수 기호가 인식이 되지 않는다. 이럴 경우 \를 이용해서 특수 기호를 넣어줘야지 제대로 표시됨 \single quote 줄바꿈 : \n tab : \t 2. Numeric operators add(더하기) : + substract(빼기) : - di..

데이터 타입 프로그래밍에서 가장 중요한 것 : 입력, 연산, 출력 사용자에게 콘솔이나 UI에서 입력받은 데이터를 잘 처리하고 연산해서 알맞게 다시 사용자에게 출력해주는 것이 제일 중요, 물론 그데이터를 전송을 이용해서 서버로 보내고 다시 받아오는 것도 중요하다. 연산을 하면서 CPU를 효율적으로 사용할 수 있도록 CPU에 최적화된 연산(logic)을 작성하는 것도 중요하고 메모리를 최소화해서 사용하는 것도 중요하다. variable rw(read / write) : variable은 메모리의 값을 읽고(read) 쓰는(write) 것이 가능하다. 그래서 변경이 가능한 값이다. 변경이 가능한 값(mutable data type) let : js에서 변수 선언할 수 있는 키워드, es6에서 추가되어진 키워드..

async와 defer html에서 javascript 표현시 어떻게 포함하는 것이 효율적인 것인가 사용자가 html 파일 다운로드시 브라우저가 한줄 한줄 분석한다(parising HTML) > 한줄한줄 분석하고 이해한 것을 CSS와 병합해서 DOM 요소로 변환 async : boolean 타입의 속성값으로 선언하는 것만으로도 true로 설정되어 옵션 사용 가능 head 안에 script 태그 html parsing하다가 script 태그 발견시 src안 js파일을 다운받아야하네 하고 이해하게 된다. 그래서 html parsing하는 것을 잠시 멈추고 그 js을 다운받아서 실행한다음에 다시 html parsing을 시작한다. 단점 : 해당 js 파일 용량이 어마어마하게 크고 인터넷도 느리다면 사용자가 그..