Daily Front_Minhhk

DOM(Document Object Model) HTML 요소를 Object(JavaScript Object)처럼 조작(Manipulation)할 수 있는 Model, DOM으로 HTML을 조작할 수 있습니다. 웹 브라우저가 작성된 코드를 해석하는 과정에서 요소를 만나면, 웹 브라우저는 HTML 해석을 잠시 멈춥니다. HTML 해석을 잠시 멈춘 웹 브라우저는 요소를 먼저 실행합니다. 요소는 등장과 함께 실행된다는 사실을 꼭 기억하세요. DOM 구조를 조회할 때에는 console.dir이 유용합니다. console.dir은 console.log와 달리 DOM을 객체의 모습으로 출력합니다. 학습 목표 DOM을 JavaScript로 조작하여 HTML Element를 추가할 수 있다. (CREATE) DOM을 ..

😁 뭔가 장황하게 나열한거 같은데,, 나름 헷갈렸던 것 위주로 정리를 해보았다! 생각보다 알고 있는 것이라고 생각한 것들이 오히려 들어가서 문제를 풀어보니 나는 제대로 알고 있던 것이 아니었고, 안다고 착각하고 대충 쓰고 있었다ㅋㅋㅋ 정신 차리고~~ 차근히 다시 하면 되니까 드ㅡㅡ가자!! 암묵적 타입 변환(Implicit coercion) || 타입 강제 변환(Type coercion) let a = 1 let b = true console.log(a+b) // 2 typeof(a+b) // 'number' let a = 1 let b = '1' console.log(a+b) // 11 typeof(a+b) // 'string' let a = 12 let b = '1' // + 제외한 -, *, / 는 ..

학습목표 spread/rest 문법을 사용할 수 있다. 구조 분해 할당을 사용할 수 있다. 개념학습 spread/rest 문법 spread 문법 주로 배열을 풀어서 인자로 전달하거나, 배열을 풀어서 각각의 요소로 넣을 때에 사용한다 function sum(x, y, z) { return x + y + z; } const numbers = [1, 2, 3]; sum(...numbers) // 질문: 어떤 값을 리턴하나요? --- 6 rest 문법 파라미터를 배열의 형태로 받아서 사용할 수 있습니다. 파라미터 개수가 가변적일 때 유용하다. function sum(...theArgs) { return theArgs.reduce((previous, current) => { return previous + cur..

"변수 및 함수 선언의 형태” 클로저 함수 클로저 함수의 특징 클로저 함수의 첫 번째 특징은 클로저 함수는 함수를 리턴하는 함수로 함수를 리턴하는 함수가 클로저의 형태를 만든다. 클로저 함수의 두 번째 특징은 내부 함수는 외부 함수에 선언된 변수에 접근 가능하다. 클로저의 활용 데이터를 보존하는 함수 외부 함수의 실행이 끝나더라도, 외부 함수 내 변수를 사용할 수 있다. HTML 문자열을 만들 수 있다. (클로저는 이처럼 특정 데이터를 스코프 안에 가두어 둔 채로 계속 사용할 수 있게 해줍니다.) 정보의 접근 제한 클로저 모듈 패턴을 내부 함수를 단 하나만 리턴하는 것에 그치지 않고, 객체에 담아 여러 개의 내부 함수를 리턴하도록 만든다. 다만 외부 스코프에서는 내부 스코프의 변수에 접근할 수 없다라는 ..

원시자료형 JavaScript에서 원시 타입의 데이터(primitive data types; 원시 자료형)는 객체가 아니면서 method를 가지지 않는 6 가지의 타입 string, number, bigint, boolean, undefined, symbol, (null) 을 말합니다. 이 중에서 자주 사용하는 4 (+1)가지 원시 자료형 string, number, boolean, undefined, (null) 원시 자료형은 모두 "하나"의 정보, 즉, 데이터를 담고 있다. === 원시 자료형은 데이터 보관함에 저장할 때 하나의 데이터만 담을 수 있다. 변수와 값이 stack에 할당된다. 원시 자료형은 값 자체에 대한 변경이 불가능(immutable)하지만, 변수에 다른 데이터를 할당할 수는 있다. ..

객체,,Object 다양한 정보를 담고자 할 때가 객체의 대표 예시가 된다. let user = { firstName: 'steve' , lastName: 'kim' , email: 'steve@naver.com' , city: 'busan' }; 중괄호(curly bracket)로 시작한다⇒ 키와 값 사이는 ‘ : ’ 콜론으로 구분 한다. ⇒ 키+값 은 ‘ , ’ 컴마로 구분한다. 여기서 첫줄을 보면 ‘cha’라는 값을 firstName이라는 키에 할당한다고 한다. 객체의 값을 사용하는법 Dot notation⇒ user.city; // kim ⇒ user.firstName; // steve Bracket notation⇒ user[’city’]; // busan ⇒ user[’firstName’] ;..