개발 일지

원본 배열을 변경하지 않고 참조만 하는 메서드 join() slice() concat() toString() 원본 배열을 변경하지 않고 반복적으로 참조만 하는 메서드 forEach() map() filter() every() some() reduce() reduceRight() entries() keys() values() 원본 배열을 변경하는 메서드 push() pop() shift() unshilft() fill() reverse() sort() splice() [참고] forEach와 map의 차이 - Array.prototype.forEach() 배열의 모든 요소가 한 번씩 순회하면서 제공된 함수를 한 번 실행한다. 각 배열의 요소에 특정한 작업을 수행할 때 사용된다. map과의 차이점은 배열을 ..

Promise 객체란 무엇인가 Promise : 시간이 얼마나 걸리든 상관없이 약속한 결과를 만들어 내는 '제작 코드(producing code)가 준비되었을 때, 함수가 결과를 사용할 수 있도록 해주는 역할. 비동기 처리를 하기 위한 자바스크립트의 방식 중 하나로 콜백 패턴이 가진 단점을 보완한다. let promise = new Promise(function(resolve, reject){ //executor(실행자, 실행함수) }); new Promise 에 전달되는 함수는 executor(실행자, 실행함수)이다. executor는 new Promise 가 만들어질 때 자동으로 실행됨. 결과를 최종적으로 만들어내는 제작 코드를 포함한다. executor executor는 보통 시간이 걸리는 일을 수..

Props 컴포넌트에 내장되어 있는 객체이다. 그 중에서 부모 컴포넌트에서 자식 컴포넌트로 정보를 전달해주는 객체이다. 넘겨주고 싶은 정보는 부모 영역에 존재한다. 자식 요소에게 넘겨주고 싶을 때 : 작명 = {변수명} 📌부모 컴포넌트 import React, {Component} from "react"; import Child form "./Child/Child"; class Parent extends Component { render(){ const name ="Kim"; test = () => { console.log('테스트입니다') } return ( Parent ); } } export default Parent; 📌자식 컴포넌트 import React, {Component} f..

6. DOM 조작 DOM manipulation : 새로운 노드를 생성하여 DOM에 추가하거나 기존 노드를 삭제 또는 교체하는 것 6-1. innerHTML Element.prototype.innderHTML : 요소 노드의 HTML 마크업을 취득하거나 변경한다. 요소 노드 콘텐츠의 영역 내에 포함된 모든 HTML 마크업을 문자열로 반환 📍참고📍 textContent는 HTML 마크업을 무시하고 텍스트만 반환 **BUT!** innerHTML 프로퍼티는 HTML 마크업이 포함된 문자열 그대로를 반환 단점 : ① 크로스 사이트 스크립팅 공격 문제 ② 고비용. 비효율 → 그대로 있어야 할 요소들까지 전부 삭제하고 다시 새로운 자식 노드를 생성해서 반영해야 하기 때문 ③ 위치를 지정할 수 없다. 기존 요소를 ..

HTML : 브라우저가 이해할 수 있는 언어로 문서가 어떤 의미를 지니고 어떤 구조로 이루어져있는지를 나타내는 것 (백지) CSS :시각적인 요소를 추가하기 위한 언어(물감) 💡 HTML, CSS 연결하는 방법? Inline Style Style tag Link 를 통한 input Javascript : 웹페이지를 동적으로 만들어주기 위한 언어 프로그래밍의 논리적 특성을 이용해서 동적으로 구현한다. HTML과 연결하는 방법? : script tag / .js 외부링크 import What is DOM? 👉HTML, JS를 연결하기 위한 중간다리 역할 👉웹 페이지에 접근해서 요소를 생성, 내용 추가, 클래스 부여 등등을 할 수 있다. Document Object Model 문서(html)를 객체화 시킨 모..

함수 스코프 Scope : 범위, 유효공간, 유효 범위 함수 스코프 : 함수에 의해서 생기는 범위. 변수의 유효범위. 블록 스코프 : Block Scope : 블락에 의해 생기는 유효범위 { }에 의해서 변수의 유효범위가 결정된다. 변수 선언 방식 종류 var, let, const ✔ 예제 1번 { let a = 10; { let a = 20; console.log(a) //20 } console.log(a) //10 } console.log(a) //reference error ✔ 예제 2번 function hasValue(p) { console.log(v) //undefined if (p) { //truthy var v = 'blue'; console.log(v); //blue } el..