728x90 🤙🏻 All121 (1-2) DOM으로 HTML 조작하기 CREATE - createElement DOM으로 HTML을 조작하는 방법 중 가장 기초적인 새로운 element를 만드는 방법이다. document.createElement('div') [코드] 새로운 div element 를 만든다. [그림] 크롬 개발자도구의 콘솔 탭에서 새로운 div 엘리먼트를 생성해보자. 자바스크립트에서 어떤 작업의 결과를 담으려면 어떻게 해야 할까? 변수를 선언하고 어떤 작업의 결과를 변수에 할당한다. 여기서는 div element를 변수 tweetDiv 에 할당한다. const tweetDiv = document.createElement('div') [코드] 새롭게 생성한 div element를 변수에 할당한다. 아직 화면에 변화가 없는 게 당연하다. tweetDiv 라는 .. 2021. 8. 5. 💻 TIL 29일차 - 21.08.04 ✍🏻 오늘 배운 것, Key Point 원시 자료형과 참조 자료형, 스코프, 클로저, 구조 분해 복습 My Wiki 원시 자료형과 참조 자료형, 스코프, 클로저, 구조 분해 부분 업데이트 프로그래머스 평균 구하기, 짝수와 홀수 통과 💡 오늘 느낀 점 오늘은 집 근처 5분 거리에 있는 카페에서 공부했는데 집보다 훨씬 집중이 잘되었다. 매번 느끼는 건데 사람들이 있는곳을 가야 사람 눈치를 보면서 집중력이 확 좋아지는 것 같다. 앞으로 더 애용해야할 것 같은 느낌이다. 그동안 나태해져서 TIL을 안쓰고 미뤄서 밀렸던 날들에 대한 미련을 버렸다. 빈칸으로 남겨져 있던 TIL을 허심탄회하게 날려버리고 다시 시작해보려고 한다. 꼭 오늘만큼의 집중력으로 계속 페이스 유지할 수 있기를 바란다. 🏇 내일 할 일 1일 1.. 2021. 8. 4. (4-2) JS/Node Spread/Rest 문법 - 구조 분해 (Destructing) 구조 분해 할당이란? Spread 문법을 이용하여 값을 해체한 후 개별 값을 변수에 할당하는 과정을 말한다. 분해 후 새 변수에 할당 배열 const [a, b, ...rest] = [10, 20, 30, 40, 50]; // 질문: a, b, rest는 각각 어떤 값인가요? // 10 // 20 // [30, 40, 50] 객체 const {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40} // 질문: a, b, rest는 각각 어떤 값인가요? // 10 // 20 // {c: 30, d: 40} 객체에서 구조 분해 할당을 사용하는 경우 선언(const, let, var)과 함께 사용하지 않으면 에러가 발생할 수 있다. 선언없이 할당하는 경우 이 콘텐츠의 하단있는 공식문.. 2021. 8. 4. (4-1) JS/Node 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 + current; }); } sum(1,2,3) // 질문: 어떤 값을 리턴하나요? sum(1,2,3,4) // 질문: 어떤 값을 리턴하나.. 2021. 8. 4. 이전 1 ··· 13 14 15 16 17 18 19 ··· 31 다음