보호되어 있는 글입니다.

2023.04.09 자바스크립트 스터디 12회차 공부 사이트: https://poiemaweb.com/ 13. Babel 1) 정의 Babel은 최신 사양의 자바스크립트 코드를 IE나 구형 브라우저에서도 동작하는 ES5 이하의 코드로 변환시킬 수 있는 트랜스파일러(Transpiler)이다. 2) 설치 npm을 이용한 Babel CLI 설치 과정 (로컬 설치 권장) // 1. 디렉터리 생성 mkdir ... // 2. package.json 생성 npm init -y // 3. babel-core, babel-cli 설치 npm install --save-dev @babel/core @babel/cli // 4. Babel 프리셋 설치 npm install --save-dev @babel/preset-en..

2023.04.09 자바스크립트 스터디 12회차 공부 사이트: https://poiemaweb.com/ 12. 제너레이터 ES6에서 도입된 제너레이터 함수는 이터러블을 생성하는 함수이다. → 이터레이션 프로토콜을 준수하여 이터러블을 생성하는 방식보다 간편하게 이터러블을 구현할 수 있다. → 비동기 처리에 유용하게 사용된다. 1) 제너레이터 // 이터레이션 프로토콜을 구현하여 무한 이터러블을 생성하는 함수 const createInfinityByIteration = function() { let i = 0; return { [Symbol.iterator]() { return this; }, next() { return { value: ++i }; } }; }; for(const n of createInfi..

2023.04.09 자바스크립트 스터디 12회차 공부 사이트: https://poiemaweb.com/ 11. 이터레이션 프로토콜 ES6에서 도입된 이터레이션 프로토콜은 데이터 컬렉션을 순회하기 위한 프로토콜이다.이를 준수한 객체는 for of문으로 순회할 수 있고, Spread 문법의 피연산자가 될 수 있다. 이터레이션 프로토콜에는 두 개의 프로토콜이 존재한다. ㅇ 이터러블 프로토콜 : "순회 가능한 자료 구조" 를 위한 프로토콜 ㅇ 이터레이터 프로토콜 : "이터러블의 요소를 탐색하기 위한 포인터" 를 위한 프로토콜 이터러블은 데이터 공급자의 역할을 한다. 1) 이터러블 for of문 등의 반복문에서 순회 가능한 자료구조. Symbol.iterator 메소드를 구현하거나, 프로토타입 체인에 의해 상속한..

기사링크 ChatGPT를 이용하는 사람들이 회사의 핵심 기밀같은 대외비 자료를 ChatGPT에 입력하는 사례가 증가하고 있다. - 반도체 회사에서 반도체 관련 프로그램을 ChatGPT에 입력해서 오류를 해결하거나 최적화를 요청 (모니터링 과정에서 적발) - 사내 회의 내용을 넣고 회의록 작성 요청 - 환자 이름과 진료 기록을 입력한 뒤, 보험사에 보낼 양식을 만들어달라 요청 - 회사 핵심 전략을 입력한 뒤, 이를 토대로 ppt 자료 제작 요청 .. 등 모 보안업체 曰 누군가가 ChatGPT에게 "OO기업의 핵심 전략을 알려달라." 요구했을 때, ChatGPT는 이전에 해당 회사 임직원이 제공한 정보를 바탕으로 대답할 가능성이 있다고 한다. NCSC 曰 "이용자들이 입력한 정보를 통해 ChatGPT가 자동..

2023.04.02 자바스크립트 스터디 11회차 공부 사이트: https://poiemaweb.com/ 10. 심볼 심볼은 ES6에서 새롭게 추가된 타입으로, 변경 불가능한 원시 타입의 값이다. 주로 충돌할 위험이 없는 객체의 프로퍼티 키를 만들기 위해 사용한다. let mySymbol = Symbol(); console.log(mySymbol); console.log(typeof mySymbol); Symbol() 함수는 래퍼 객체를 생성하는 생성자 함수와 달리, new 연산자를 사용하지 않는다. 해당 함수에 문자열을 인자로 전달할 수 있으나, Symbol 생성에 어떠한 영향도 주지 않는다. 단지 생성한 Symbol에 대한 설명을 달아줄 뿐이다. (디버깅 용도) 1) Symbol의 사용 Symbol 값..

2023.04.02 자바스크립트 스터디 11회차 공부 사이트: https://poiemaweb.com/ 9. 프로미스 비동기 처리 시 콜백 함수를 사용하는데, 콜백 함수는 여러가지 단점을 가지고 있다. 이러한 콜백 패턴 대신 사용하는 객체가 프로미스이다. 1) 콜백 패턴의 단점 ① 콜백 헬 비동기 처리 모델은 실행 완료를 기다리지 않고 다음 작업을 즉시 실행한다. 비동기 함수의 처리 결과를 가지고 다른 비동기 함수를 호출해야 하는 경우, 함수 호출이 중첩되어 복잡도가 높아지는 현상이 콜백 헬이다. 콜백 헬은 가독성을 낮추고, 복잡도를 증가시켜 실수를 유발하는 원인이 되며, 에러 처리가 곤란하다. ② 에러 처리 try { setTimeout(()=> { throw new Error('Error!'); },..

2023.04.02 자바스크립트 스터디 11회차 공부 사이트: https://poiemaweb.com/ 8. 모듈 모듈: 애플리케이션을 구성하는 개별적 요소. 재사용 가능한 코드 조각을 의미한다. 1) 모듈 스코프 HTML에서 자바스크립트 파일 2개를 로드하면 해당 파일들은 하나의 전역을 공유한다. 그러니 ES6의 모듈은 파일 자체의 스코프를 제공하기에, 독자적은 모듈 스코프를 갖는다. 모듈 내에서 var 키워드로 선언한 변수는 전역 변수가 아니게 되며, window 객체의 프로퍼티가 아니게 된다. // m1.mjs var x = 'test'; console.log(x); //console.log(window.x); //window is not defined // m2.mjs var x = 'TEST';..