Javascript(16)
-
콜백함수
자바스크립트는 보통 프로그래밍 언어들과 생각하는 방식자체가 다르다. print(1) time.sleep(1) print(2) 파이썬의 경우 위의 코드를 이용하여 1초쉬고 출력이 가능하다. console.log(1); setTimeout(function(){}, 1000); console.log(2); 하지만 자바스크립트는 중간에 저 코드가 있어도 stack 에서 WEB API로 보내기 때문에 1과 2가 동시에 출력된다. 자바스크립트에서 순차적으로 실행하기 위해서는 콜백함수를 쓰면 된다. console.log(1); setTimeout(function(){console.log(2);}, 5000) 콜백함수는 그저 함수안에 함수를 쓰는 것 뿐이다. function 첫째함수(콜백){ console.log(1..
2022.08.23 -
웹브라우저의 동작원리 Stack, Queue
우리가 작성하는 자바스크립트는 브라우저가 실행을 시켜준다. 쉽게 말해 HTML, CSS, JavaScript를 해석해주는 엔진이다. 용어 정리 Heap : 변수들이 저장되는 공간 Stack : 작성한 코드를 실행해 주는 곳 (하나이기 때문에 자바스크립트는 Single thread 라고 한다.) Queue : 대기끝난 코드를 Stack에 보내는 공간 Stack 이라는 공간에는 구현한 코드가 한줄 한줄 쌓인다. 구현한 코드 내에 선언한 변수들은 Heap이라는 공간에 쌓인다. Stack은 하나 뿐이기때문에 한 번에 코드 하나밖에 실행할 수 없다. 그래서 자바스크립트는 전문용어로 single threaded 라고도 한다. 병렬처리X setTimeout을 이용해서 체감하기 console.log(1+1); set..
2022.08.22 -
Prototype(2)
ES5방식으로 쉽게 구현하는 상속 기능 Object.create(물려받을 부모 객체) ES6방식으로 구현하는 상속기능(Class)
2022.08.20 -
Prototype(1)
Only 자바스크립트만 constructor 말고 상속기능을 구현할 수 있는 장치가 있다. = 프로토타입(유전자) 함수를 만들면 prototype이라는 항목이 안에 생성된다. 위에 보면 Student라는 클래스에 prototype이라는 항목이 안에 생성되어있고 gender 를 '바다생물'로 정의해주자 클래스로 부터 생성되는 인스턴스는 모두 이를 상속받게 된다. 학생1.gender는 이제 바다생물이다. 자바스크립트에서는 오브젝트에서 값을 출력할 때 이런 순서로 진행된다. 1. 학생1에 직접 gender라는 값이 있는가? 2. 그럼 부모 유전자에 gender 라는 값이 있는가? 3. 그럼 부모의 부모 유전자에 gender라는 값이 있는가? ... 계속 타고올라간다는 뜻 console.log(학생1.toStr..
2022.08.19 -
ES6 Constructor
Constructor 용도: 비슷한 Object를 많이 만들기 위해서. 코드만 다를 뿐 똑같다. function으로 했을 때 VScode에서 버전 바꿀거냐고 물어봐준다. (친절하다..) var 학생1 = new Student('뚱이' , 29); var 학생2 = new Student('징징이', 29); console.log(학생1, 학생2); //Student { name: '뚱이', age: 29, sayHi: [Function (anonymous)] } // Student { name: '징징이', age: 29, sayHi: [Function (anonymous)] } 학생1.sayHi() //안녕하세요 저는 뚱이입니다. 학생2.sayHi() //안녕하세요 저는 징징입니다. 새로 생성되는 오브젝..
2022.08.18 -
ES6 변수
var let const 재선언 O X X 재할당 O O X 범위 function { } (for, if, function등) { } (for, if, function등) 스폰지밥 = '징징이' TypeError: Assignment to constant variable. Object.freeze하면 재할당 안됨. use strict 사용시 오류도 내보내 준다. 아마 타입스크립트로 작성 시 객체 내 값 또한 재할당 안될듯하다. TypeError: Cannot assign to read only property '최애' of object '#'
2022.08.12