FE/Javascript

이 포스팅에서 작성하는 내용은 자바스크립트 중급 강좌 에서 발췌하였습니다. https://inf.run/QG5D [무료] 자바스크립트 중급 강좌 - 인프런 | 강의 이 수업은 중급 자바스크립트 수업으로, "자바스크립트 기초 지식이 있으신 분"을 대상으로 진행합니다., - 강의 소개 | 인프런 www.inflearn.com 1. 상속, 프로토타입 위의 사진과 같이, 객체에 기본적으로 담겨있는 함수들 / 상속받은 함수들의 모임을 프로토타입이라고 한다. 객체 내부와 프로토타입에 같은 함수가 있다면? 객체 내부에 있는 함수가 동작 (탐색 순서 : 객체 > 프로토타입) const animal = { sound() { console.log('animal'); } }; const dog = { legs: 4 }; d..

이 포스팅에서 작성하는 내용은 자바스크립트 중급 강좌 에서 발췌하였습니다. https://inf.run/QG5D [무료] 자바스크립트 중급 강좌 - 인프런 | 강의 이 수업은 중급 자바스크립트 수업으로, "자바스크립트 기초 지식이 있으신 분"을 대상으로 진행합니다., - 강의 소개 | 인프런 www.inflearn.com 1. 구조 분해 배열 구조 분해 let names = ['Iron Man', 'Spider Man', 'Ant man']; let [name1, name2, name3, name4='No Name'] = names; console.log(name1); // 'Iron Man' console.log(name2); // 'Spider Man' console.log(name3); // 'An..

이 포스팅에서 작성하는 내용은 자바스크립트 중급 강좌 에서 발췌하였습니다. https://inf.run/QG5D [무료] 자바스크립트 중급 강좌 - 인프런 | 강의 이 수업은 중급 자바스크립트 수업으로, "자바스크립트 기초 지식이 있으신 분"을 대상으로 진행합니다., - 강의 소개 | 인프런 www.inflearn.com 1. var / let / const var let const 변수 재선언 O X X 선언 전에 사용 O (undefined) X X 변수 생성 과정 선언과 동시에 초기화 진행 (undefined) 후 할당 선언 → 초기화 → 할당 선언, 초기화, 할당 동시 진행 값 변경 O O X (객체라면 객체 내부의 값은 변경 가능) 범위 함수 범위 블록 범위 블록 범위 ex) 함수, if, fo..

이 포스팅에서 작성하는 내용은 프론트엔드 날개달기 에서 발췌하였습니다. https://inf.run/MYzP [무료] 프론트엔드 날개달기: Vuejs, React 배우기 전에 꼭 알아야하는 지식 - 인프런 | 강의 이 강의를 통해 Webpack, NPM 등 프론트엔드 개발자가 되기 전에 꼭 알아야할 지식을 탄탄히 다질 수 있습니다., - 강의 소개 | 인프런 www.inflearn.com Event Flow 이벤트의 전체 흐름 : 최상위 영역 → 타겟 영역 → 최상위 영역 ex) html → body → main → div → span → div → main → body → html capturing : 최상위 영역 → 타겟 영역 bubbling : 타겟 영역 → 최상위 영역 Javascript의 기본 ..

이 포스팅에서 작성하는 내용은 프론트엔드 날개달기 에서 발췌하였습니다. https://inf.run/MYzP [무료] 프론트엔드 날개달기: Vuejs, React 배우기 전에 꼭 알아야하는 지식 - 인프런 | 강의 이 강의를 통해 Webpack, NPM 등 프론트엔드 개발자가 되기 전에 꼭 알아야할 지식을 탄탄히 다질 수 있습니다., - 강의 소개 | 인프런 www.inflearn.com DOM Document Object Model : 문서 객체 모델 브라우저에서 javascript로 html 요소를 제어할 수 있도록 제공하는 API 같은 역할 나무모양의 Tree구조를 가지며, 각 구성요소를 노드(Node)라고 함 최상위 노드에는 document 노드가 존재함 BOM Browser Object Mode..

안녕하세요. 이번 포스팅에서는 HTML 요소 중 하나인 textarea를 개행할 때 사용되는 CRLF를 치환하는 방법에 대해서 적어보겠습니다. 1. HTML vs HTML_textarea - HTML 내에서의 개행 : - HTML 요소인 textarea에서의 개행 : CRLF(\r\n) 2. 문제 배경 - JS에서 CRLF가 오류를 일으킬 때가 있다. → ex) textarea(개행(CRLF)이 포함된 값이 있음)가 포함된 HTML 문자열을 innerHTML에 넣으니 오류 발생. 3. 해결 방법 1) innerHTML에 넣기 전에 로 치환하여 사용(innerHTML이 아니더라도, 오류가 나는 함수에서 사용 가능) 2) textarea에서 개행은 안이루어지고, 로 보인다. 3) 그럼 다시, javascri..

안녕하세요. 이번 포스팅에서는 Javascript의 변수 선언 방식인 var, let, const에 대해서 알아보겠습니다. 1. var 기존에 사용하던 변수 선언 방식 같은 이름으로 변수를 다시 선언할 수 있음(수정도 가능하다.) 간단한 소스에서는 편리하지만, 복잡한 코드에서는 유지보수가 힘들어질 가능성이 높음 Scope 전역 변수로 선언된 경우 : 모든 곳에서 사용할 수 있음 함수 내에서 선언된 경우 : 함수 내에서만 사용됨 변수 선언 전에도 사용 가능 // ======= 같은 이름으로 변수를 다시 선언 및 수정 가능 ========= var name = "멍목"; var name = "김멍목"; // 정상 작동 // ===============================================..

회사에서 근무 중에 javascript가 정상적으로 작동하지 않는 현상을 발견했다. 해당 현상은 chrome과 Edge에서 발생하였으며, 개발자도구를 켰을 땐 정상작동하고 껏을 땐 제대로 작동하지 않았다. 그리고 오류가 아닌 경고가 콘솔로그에 아래와 같이 나타났다. A window.confirm() dialog generated by this page was suppressed because this page is not the active tab of the front window. Please make sure your dialogs are triggered by user interactions to avoid this situation. 페이지 구조는 부모페이지, 부모페이지로부터 호출한 팝업으로 구..