2023.03.26 자바스크립트 스터디 10회차 공부 사이트: https://poiemaweb.com/ 1. ECMAScript 6 ES5까지는 변수를 선언하기 위해 var 키워드를 사용했다. 그러나 var 키워드로 선언된 변수는 몇 가지 문제점이 존재한다. (이전 포스팅) ① 함수 레벨 스코프 - 전역 변수의 남발 문제 - for loop 식에서 사용한 변수를 for loop 외부/전역에서 참조할 수 있음 ② 중복 선언 허용 - 의도치 않은 변수값 변경 ③ var 키워드 생략 허용 - 의도치 않은 변수의 전역화 ④ 변수 호이스팅 - 변수 선언 전에 참조가 가능 대부분의 문제는 전역 변수로 인해 발생한다고 한다. 유효 범위(scope)가 넓고, 비순수 함수이기에 의도치 않게 변경될 수 있기 때문이다. 복..

2023.03.19 자바스크립트 스터디 9회차 공부 사이트: https://poiemaweb.com/ 36. SPA & Routing SPA(Single Page Application) - 단일 페이지로 구성 - 배포가 간단함 - 네이티브 앱과 유사한 사용자 경험 제공 가능 SPA는 웹 애플리케이션에 필요한 정적 리소스를 최초 접근시에만 다운로드한다. 이후 새로운 페이지 요청 시 페이지 갱신에 필요한 데이터만을 JSON으로 전달받아 페이지를 갱신하기에 전체적인 트래픽 감소가 가능하다. 그러나 구조적인 단점을 가지고 있다. 초기 구동 속도가 상대적으로 느리다는 것과 SEO 이슈이다. SEO는 검색엔진에 키워드를 검색했을 때 웹 사이트가 노출되는 것을 의미한다. 그러나 SPA는 CSR(Client Side ..

2023.03.19 자바스크립트 스터디 9회차 공부 사이트: https://poiemaweb.com/ 35. REST API REST(Representational State Transfe) · REST(REpresentational State Transfer): 자원을 이름으로 구분하여 자원의 상태를 주고받는 모든 것. URI로 자원을 구분하고 해당 자원에 CRUD Operation을 적용한다. · REST API: REST 아키텍처 스타일을 준수하는 API · CRUD Operation: Create, Read, Update, Delete > GET 요청으로 레코드 검색 > POST 요청으로 레코드 작성 > PUT 요청으로 레코드 업데이트 > DELETE 요청으로 레코드 삭제 HTTP request의..

2023.03.19 자바스크립트 스터디 9회차 공부 사이트: https://poiemaweb.com/ 34. Ajax (Asynchronous JavaScript and XML) Ajax는 자바스크립트를 이용해서 비동기적으로 서버와 브라우저가 데이터를 교환할 수 있는 통신 방식이다. 서버로부터 웹페이지 반환 시 화면 전체를 갱신하지 않고, 일부만을 갱신할 수 있도록 하는 것이 Ajax. 1) JSON(Javascript Object Notation) 클라이언트와 서버 간 데이터 교환을 위한 데이터 포맷 { "name" : "홍길동", "gender" : "male", "age" : 20 } ※ 키는 반드시 큰 따옴표를 사용해야 함 ① JSON.stringify(value [, replacer] [, sp..

2023.03.19 자바스크립트 스터디 9회차 공부 사이트: https://poiemaweb.com/ 32. 이벤트 이벤트가 발생하면 이를 감지하고, 대응하는 처리를 호출해 주어야 한다. 브라우저는 이벤트를 감지할 수 있으며 이벤트 발생 시에는 통지를 해준다. 이런 과정을 통해 사용자와 웹 페이지가 상호작용이 가능하다. 발생한 이벤트에 맞게 반응하기 위해 함수를 사용한다. ← 이 함수가 이벤트 핸들러 1) 이벤트 루프와 동시성 브라우저는 단일 스레드에서 이벤트 드리븐 방식으로 동작한다. ＃단일 스레드: 스레드가 하나이므로 하나의 작업만을 처리할 수있다. 그러나 웹 애플리케이션은 많은 작업이 동시에 처리되는 것처럼 느껴지는데, 이는 자바스크립트의 동시성 때문이다. 동시성을 지원하는 것이 이벤트 루프이다. ..

주통기 항목 [W-24] NetBIOS 바인딩 서비스 구동 점검 스크립트 통해 진단할 때 헷갈리는 것 적어둠. NetBIOS : 이더넷 프레임을 사용하여 네트워크 상의 호스트 이름을 해결하는 프로토콜. HKLM\SOFTWARE\Microsoft\Windows NT\CurrentVersion\NetworkCards : 할당된 네트워크 정보를 확인 (네트워크 카드 이름) : NetBIOS 서비스를 점검하려면 컴퓨터의 네트워크 카드가 올바르게 설치되어 있고 작동 중인지 확인해야 함. 만약 네트워크 카드가 비활성화 되어있는 경우, NetBIOS 서비스가 작동하지 않을 수 있음. : 그래서 해당 레지스트리를 확인하는 것. HKLM\SYSTEM\ControlSet001\services\NetBT\Parameters..

2023.03.05 자바스크립트 스터디 8회차 공부 사이트: https://poiemaweb.com/ 31. 동기식/비동기식 처리 모델 1) 동기식 처리 모델 태스크가 순차적으로 실행되며, 어떤 작업이 수행 중이면 다음 작업은 대기한다. 서버에서 데이터를 가져와서 화면에 표시할 때, 서버가 응답할 떄까지 이후 태스크들은 블로킹된다. // 동기식으로 동작 function func1(){ console.log('func1'); func2(); } function func2(){ console.log('func2'); func3(); } function func3(){ console.log('func3'); } func1(); 2) 비동기식 처리 모델 태스크가 종료되지 않은 상태더라도 다음 태스크를 실행한다...

2023.03.05 자바스크립트 스터디 8회차 공부 사이트: https://poiemaweb.com/ 30. DOM 브라우저의 렌더링 엔진은 웹 문서를 로드한 후, 파싱하여 웹 문서를 브라우저가 이해할 수 있는 구조로 구성하여 메모리에 적재한다. 이를 DOM이라 한다. → 모든 요소, 요소의 속성, 텍스트를 각각 객체로 만들고 트리구조로 구성한 것이 DOM이다 DOM은 자바스크립트를 통해 동적으로 변경할 수 있다. DOM에 접근하고 수정할 수 있는 프로퍼티/메소드를 갖는 자바스크립트 객체를 DOM API라 한다. 1) DOM tree 브라우저가 HTML 문서를 로드한 후 파싱하여 생성하는 모델을 의미한다. (객체 트리로 구조화) 노드 설명 Document Node (문서 노드) 트리의 최상위에 존재. E..