Programming Languages/Javascript9 자바스크립트 언어에서의 비동기 경험 선결론 : 제대로 사용할 줄만 안다면 큰 도움이 된다. 서론 자바스크립트 언어는 위키백과의 말을 빌리자면 다음과 같습니다. JavaScript is high-level, often just-in-time compiled, and multi-paradigm 파이썬과 같은 사람들이 사용하는 일상 용어와 비슷하면 high-level 이라고도 합니다. 즉, 기계언어, machine language 와 비슷해질 수록 low-level 로 불리죠. 여기에 속하는 언어들은 C 가 있죠. 더 들어가면 Machine Language, 거의 이진수를 사용하는 수준과 사람들이 그나마 이해할 수 있는 단어들이 존재하는 Assembly Language 가 있습니다. 사실 위 정의를 굳이 언급하지 않아도 자바스크립트를 사용하시는.. 2022. 5. 31. ES6 Classes and Super...? 선결론 : Sugar Coating 되어 버린 ES6 클래스 문법을 이용하면 편리하다 자바스크립트는 사실 클래스의 뚜렷한 기반이 있는 언어가 아니다. 처음부터 지금까지 자바스크립트는 OOP가 아닌 객체 지향 언어일 뿐이다. 그렇기에 꽤 오랜 시간동안 클래스를 활용하기 위한 몸부림치는 노력들이 있었으며 그 노력들은 일종의 임시 방편이나 일시적인 해결책에 지나지 않았다. 결국에는 ES6라는 문법에 Class 와 상속이 가능한 Super 가 등장하게 되면서 그 이후로 언어를 접하는 사람들은 자바스크립트가 객체 지향 프로그래밍 이라는 착각을 할 수도 있다. 허나, class 나 super 등의 문법은 사실 기존에 사용했던 상속 및 클래스 생성 방법들을 깔끔하게 정리해준 것 뿐 그 이하도 이상도 아니다. 자 그럼.. 2022. 5. 31. this의 세계 선결론: this를 이해하려면 많은 시간이 필요할 듯 하다 일단 기본적으로 this는 총 다섯 가지의 경우로 나눌 수 있다고 한다. 1. Global Reference 이 경우에는 window 혹은 global을 가리키는 this로 쓰일 때인데 그냥 바로 this를 찾게 되면 여기로 뜬다. 2. Free Function Invocation 이 경우에도 마찬가지로 window 혹은 global로 바인딩이 된다. 1번이나 2번이나 그다지 유용하지는 않지만 그래도 this의 출발점은 되어주기도 한다. 3..call or .apply invocation 이 두 가지의 경우인 .call과 .apply에서는 자바스크립트에서 사용할 수 있는 방법이다. 인자로 this를 수동적으로 넘겨주게 되면서 this를 지정할 수.. 2022. 5. 30. 비동기적 호출 - [setTimeout, setInterval] 선결론 : 비동기적 호출, asynchronous call은 이해하기 쉽지는 않지만 그만큼의 재미가 있다 여태까지 자바스크립트에서 배운 코딩은 동기적 호출이었다. 간단하게 풀자면 하나씩 부르는 형식이다. console.log("Hello") console.log("World") console.log("!") // returns // "Hello" // "World" // "!" 위처럼 콘솔에는 하나하나씩 실행을 하게 된다 하지만 이를 비동기적으로, 즉 시간을 동시가 아닌 다르게 해서 호출을 하고자 한다면, 이를 가능하게 해주는 것이 setTimeout과 setInterval이다. console.log("Hello") setTimeout(function() { console.log("World") }, 1.. 2022. 5. 30. super()를 이용한 class 상속 방법 (ES6) 선결론 : super()를 이용하면 편리하지만 인터넷 익스플로어와는 호환성 문제가 있다. 클래스를 만들면 거기에 속한 속성들을 이용해서 다른 클래스에게 속성을 상속시킬 수 있다. 이 글에서는 ES6 문법을 이용해 class를 만들어 super로 상속하는 방법에 대한 내용이다. class Polygon { constructor(height, width) { this.name = 'Polygon'; this.height = height; this.width = width; } sayName() { console.log('Hi, I am a ', this.name + '.'); } } 위와 같은 코드를 상속받는 다른 class를 작성할 때에 super를 이용해 상위 class의 속성들을 받을 수 있다. cla.. 2022. 5. 30. Javascript의 Class 활용법 선결론 : 나는 ES6의 class 문법을 선호한다. 자바스크립트에서 class은 크게 두 가지 방법으로 나눌 수 있다. 첫번째 방법은 : function Person(firstName, lastName, age) { this.firstName = firstName; this.lastName = lastName; this.age = age; } Person.prototype.greeting = function() { return "Hello, " + this.firstName } 인데 위처럼 실행하게 되면 Person이라는 클래스를 생성하게 되고 그 함수 내에 있는 것들을 생성자 함수라고 부른다. 만약에 method를 추가하고 싶다면 해당 클래스의 prototype을 접근 후 새로운 method를 추가해.. 2022. 5. 30. Const, Var, Let 오늘은 변수와 관련된 세 가지 종류에 대해서 배웠다. 선결론 : let을 사용하자 물론 경우마다 다른 타입을 사용하는 것은 매우 중요하다. 이 3가지가 어떻게 다른지 알기 위해서는 스코프라는 것이 매우 중요하다. 전역과 지역이라고 나뉘는 scope에는 함수와 코드 블럭으로 나뉘어지기도 한다. 가령 예를 들어: let name = "James"; function logName() { let name = "Smith"; console.log(name) } console.log(name); logName(); console.log(name); 이렇게 적으면 결과는 "James", "Smith", "James"가 된다 그 이유는 "James"는 전역 변수로 선언이 되어서 첫 console.log(name)에서 .. 2022. 5. 30. Switch Cases 오늘은 JS의 switch cases 를 이용하는 방법에 대해서 설명하고자 한다. 선결론 : 흔히 사용하는 if 조건문의 활용 범위는 매우 넓지만 switch 가 더 적합하고 깔끔할 때가 있다. Switch 사용법에 대해서 먼저 말하자면, 어떠한 expression을 주고 해당하는 조건문이 들어맞으면 거기에 포함된 코드를 실행하는 것이다. 즉, const expr = 'Papayas'; switch (expr) { case 'Oranges': console.log('Oranges are $0.59 a pound.'); break; case 'Mangoes': case 'Papayas': console.log('Mangoes and papayas are $2.79 a pound.'); // expected.. 2022. 5. 30. 이전 1 2 다음