썸네일 WebSocket이란? 개념과 동작 과정 (+socket.io, Polling, Streaming...) 📢 들어가며 직장에서 자동 업데이트 기능을 구현할 일이 생겼다. 누군가 웹의 데이터를 수정했을 때 다른 PC를 사용 중인 사람의 화면에도 해당 데이터가 자동으로 실시간 업데이트 되게하는 기능이었다. 나는 이 기능을 구현하기 위해 5초마다 한번 씩 데이터의 수정된 시간를 DB에서 가져왔고, DB에서 가져온 수정된 시간이 기존 수정된 시간과 다르다면 화면이 refresh 되도록 구현했다. (구현할 땐 몰랐는데, 이렇게 일정 주기로 통신하여 가져오는 방법을 Polling 이라고 한단다.) 그런데 대리님께서 이렇게 하는 것도 틀린 건 아니지만 웹 소켓을 사용하는 방법이 있다고 말씀해주셨다. 나는 웹 소켓에 대해 전혀 알지 못했다... 그래서 부랴부랴 공부하고 Polling 방식으로 구현된 코드를 웹 소켓 방식으..
썸네일 [leetCode] 9. Palindrome Number (Easy) 풀이 ❓ 문제 Given an integer x, return true if x is palindrome integer. An integer is a palindrome when it reads the same backward as forward. For example, 121 is a palindrome while 123 is not. 주어진 정수형 x 가 회문(역순으로 읽어도 같은 말이나 구절 또는 숫자)이면 true를 반환하세요. 예를 들어, 121은 회문이고, 123은 회문이 아닌 것입니다. Example 1 Input: x = 121 Output: true Explanation: 121 reads as 121 from left to right and from right to left. Example ..
썸네일 [JavaScript] use strict? 엄격 모드란? 📢 들어가기 전에 본 포스팅에선 모던 JavaScript 튜토리얼을 학습/복습한 내용을 다룬다. 😈 엄격모드란? 자바 스크립트는 기존 기능을 변경하지 않으면서 새로운 기능을 추가해왔기 때문에 호환성 문제가 없었다. 하지만 ES5부터 새로운 기능이 추가되고 기존 기능의 일부가 변경되었다. 기존 기능이 변경되어 호환성에 문제가 생기게 되었고, 이를 방지하기 위한 것이 엄격 모드(strict mode) 이다. 👉 엄격 모드를 쓰지 않으면 과거 스크립트와의 호환성을 유지할 수 있기 때문에 지금의 문법과 맞지 않는 과거의 코드가 작동할 수 있게된다. 👉 엄격 모드를 활성화하면 모던 자바스크립트가 기준이 되어 과거에 짜 놓은 코드가 동작하지 않게될 수도 있다. 😈 엄격모드 사용 방법 스크립트 최상단에 단순한 문자열..
썸네일 [JavaScript] 자바스크립트란? (개념 및 특징) 📢 들어가기 전에 본 포스팅에선 모던 JavaScript 튜토리얼을 학습/복습한 내용을 다룬다. 💛 자바스크립트란? 자바스크립트는 웹 페이지에 생동감을 붙어넣기 위해 만들어진 프로그래밍 언어이다. 스크립트 자바스크립트로 작성한 프로그램을 스크립트라고 부른다. 스크립트는 웹페이지의 HTML안에 작성할 수 있는데, 웹 페이지를 불러올 때 스크립트가 자동으로 실행된다. 스크립트는 컴파일러 없이 보통의 문자 형태로 작성/실행할 수 있다. "자바"스크립트라고 불리는 이유 위 스크립트의 특징을 보면, 자바(JAVA)랑은 매우 다른 언어임을 알 수 있다. 하지만 왜 자바스크립트라고 불리는걸까? 처음 자바 스크립트가 만들어졌을 때는, LiveScript 라는 이름으로 불렸다. 그런데 그 당시 자바의 인기가 아주 높은 ..
썸네일 [JavaScript] 실행 컨텍스트, 스코프 체인과 클로저 🚗 브라우저란? 인터넷 상에서 웹에 연결 시켜주는 윈도우 기반의 소프트웨어이다. 그 예로, 크롬, 파이어폭스, 사파리, 엣지 등을 브라우저라고 부른다. 🚗 브라우저 구성 사용자 인터페이스 주소 표시줄, 이전/다음 버튼, 북마크 메뉴 등 브라우저 엔진 사용자 인터페이스와 렌더링 엔진 사이의 동작을 제어 렌더링 엔진 요청한 콘텐츠 표시. 예를 들어 HTML을 요청하면 HTML과 CSS를 파싱하여 화면에 표시함 통신 HTTP 요청과 같은 네트워크 호출에 사용됨 자바스크립트 해석기(엔진) ✔ 자바스크립트 코드를 해석하고 실행한다. 브라우저마다 이 엔진이 다르다. V8, Rhino, SpiderMonkey, Nashron 등이 있다. UI 백엔드 콤보 박스와 창 같은 기본적인 장치를 그림. 플랫폼에서 명시하지 않..
썸네일 [JavaScript] Scope란? (스코프 체인, 실행 컨텍스트...) 🛒 Scope란? Scope는 직역하면 "범위"라는 뜻이다. JavaScript 에서 Scope(스코프)는 변수에 접근할 수 있는 범위를 말한다. 식별자(변수)를 찾기위한 규칙이라고도 한다. var x = 'global'; function foo () { var x = 'function scope'; console.log(x); } foo(); // ? console.log(x); // ? 위 예제에서 x가 두번 선언되었는데, JavaScript는 각 x가 어떤 값을 가지는지 어떻게 구별할 수 있을까? 위 예제에서 전역에 선언된 변수 x는 어디에든 참조할 수 있다. 하지만 함수 foo 내에서 선어도니 변수 x는 함수 foo 내부에서만 참조할 수 있고, 외부에서는 참조할 수 없다. 이러한 규칙을 스코프 라..

티스토리툴바