보호되어 있는 글입니다.
[ES6] [Part2] default parameter, arguments, rest parameter, spread
🔖TAG 💡arguments, 💡Default, 💡REST, 💡SPREAD 📗 자바스크립트 함수 업그레이드하기 (default parameter/arguments) 함수에서 쓰는 점3개 Rest 파라미터 Spread, rest 파라미터 연습문제 8개 JS Deep Dive 참고 10장 - 객체 리터럴 26장 - ES6 함수의 추가 기능 https://stackoverflow.com/questions/40102199/counting-words-in-javascript-and-push-it-into-an-object Counting words in javascript and push it into an object I want to achieve a javascript program that count th..
[ES6] [Part1] arrowFunction, this, variable, hoisting, template/tagged literals, spread Operator, apply, call
🔖TAG 💡apply, 💡Arrow, 💡call, 💡hoisting, 💡setTimeout, 💡SPREAD, 💡tagged, 💡Var, 💡비동기, 💡전역변수 📗 Arrowfunction 은 function을 대체하는 신문법이 아님 var 오브젝트1 = { 함수 : function(){ console.log(this) } } 오브젝트1.함수() // 오브젝트1 출력 var 오브젝트2 = { 함수 : () => { console.log(this) } } 오브젝트2.함수() //window 출력 this값은 함수를 만나면 항상 변하는데 arrowfunction 안에서는 변하지 않고 밖에 있던 this를 그대로 쓴다 this & arrow function 연습문제 해설 버튼 변수 신문법 총정리 2. Hoisti..
[크롬 앱 만들기] code 완성본
내 깃 저장소: https://github.com/Harimad/portfolio_todo https://harimad.github.io/portfolio_todo/ toDo.id !== parseInt(li.id)); saveToDos(); } function paintToDo(newTodo) { const li = document.createElement("li"); li.id = newTodo.id; const span = document.createElement("span"); span.innerText = newTodo.text; const button = document.createElement("button"); button.innerText = "❌"; button.addEventListe..
[크롬 앱 만들기] #8 WEATHER
weatherAPI: https://home.openweathermap.org #8.0 Geolocation geolocation참고: https://devdocs.io/dom/geolocation/getcurrentposition function onGeoOk(position) { const lat = position.coords.latitude; const lng = position.coords.longitude; alert(`You live in ${lat} ${lng}`); } function onGeoError() { alert(`Can't find you. No wather for you.`); } navigator.geolocation.getCurrentPosition(onGeoOk, onG..
[크롬 앱 만들기] #7 TO DO LIST
todo.js 전체코드: const todoForm = document.querySelector('#todo-form'); const todoInput = document.querySelector('#todo-form input'); const todoList = document.querySelector('#todo-list'); const TODOS_KEY = 'todos'; //localStorage key값의 이름 let toDos = []; //새로고침하면 toDos값이 초기화 됨 -> 아래에 toDos값을 계속 가지도록 toDos = JSON.parse(localStorage.getItem(TODOS_KEY)) 함 function handleTodoForm(event) { event.preven..
[크롬 앱 만들기]#5 CLOCK | PadStart, 생성자 함수
#5.2 PadStart function getClock() { const date = new Date(); const hours = String(date.getHours()).padStart(2, '0'); //2자리 문자로, 한 자리면 문자 0 채움 const minutes = String(date.getMinutes()).padStart(2, '0'); const seconds = String(date.getSeconds()).padStart(2, '0'); console.log(`${hours}:${minutes}:${seconds}`); } getClock() //초기 화면 setInterval(getClock, 1000); Q. 왜 Date라는 객체를 바로 안쓰고 new로 새로운 객체를 만드는..
[크롬 앱 만들기] #4.1 Form Submission | form -> submit
form태그 와 Submit form 태그 안의 input type='submit'태그나 button 태그가 클릭되거나 enter값이 입력되면 결과적으로 submit 이벤트가 발생한다. form 태그의 submit이벤트는 기본적으로 페이지가 매번 새로고침기능을 동반한다. 새로고침을 방지하기 위해서 preventDafault 함수를 사용하면 된다. Btn Log In 아래는 코드 실행 결과 HTML 삽입 미리보기할 수 없는 소스 매개변수 Event (중요!!) ★ 중요 ★ form을 submit하면 브라우저는 기본적으로 페이지를 새로고침 하도록 되어있다.