본문 바로가기

자바스크립트111

[ JavaScript ] JavaScript와 JQuery 를 이용한 간단한 타이머 만들기 | 제이쿼리 setTimeout 함수 timer 0.00 다음 html 코드를 실행하면 아래와 같이 출력된다. 이제 자바스크립트와 제이쿼리를 이용해서 timer 아래의 숫자가 증가하게 만들어보자! 사실,,, 코드는 너무 너무 간단하다. 코드부터 보여드리고 설명을 진행하겠다. // 시간을 담을 변수 t var t=0; function timer(){ // 0.01(10ms)초마다 t 값을 0.01 증가시키고 // 증가된 t 값을 timer 클래스 하위 html에 출력 setTimeout(function(){ t+=0.01; $(".timer").html(`${t.toFixed(2)}`); timer(); }, 10) }; timer(); 우선 시간 담을 변수 t 를 하나 선언해주고, setTimeout 이라는 제이쿼리 함수를 이용해 제작했다... 2021. 1. 13.
[ JavaScript ] 자바스크립트 바인딩과 this | 자바스크립트 개념 자바스크립트에서는 바인딩와 this 의 개념이 끊임없이 나옵니다. 바인딩과 this 는 많은 사람들이 혼동할 수 있고, 개발을 계속 하시는 분들도 헷갈릴만한 부분이라고 생각해 포스팅을 합니다! 자바스크립트 바인딩? 바인딩이란, 함수 또는 메소드를 호출한 대상에 실제 함수를 연결해주는 것입니다. 즉, 함수를 호출하는 부분에 함수가 위치한 메모리 번지를 연결시켜주는 것이라 할 수 있죠. 예시로 살펴봅시다. 코드가 더 이해하기 쉬우니까요. var aObj = { num:'1' printNum:function(){ console.log(this.num); } } var bObj = { num:'2' } bObj.printNum = aObj.printNum; aObj.printNum(); // 1 bObj.pri.. 2021. 1. 8.
[ JavaScript ] CRUD란? | CRUD 정의ㅣ 개발 기초 이 포스팅은 구름 edu의 강태공 님의 강의를 바탕으로 이해한 것을 제 식대로 정리한 포스팅임을 미리 공지합니다. edu.goorm.io/learn/lecture/25046/%EB%AC%B8%EB%B2%95%EC%B1%85-%EC%A1%B8%EC%97%85%ED%95%98%EC%9E%90-%EB%A7%8C%EB%93%A4%EB%A9%B4%EC%84%9C-%EB%B3%B5%EC%8A%B5%ED%95%98%EB%8A%94-javascript 문법책 졸업하자! 만들면서 복습하는 JavaScript - 구름EDU 자바스크립트 공부는 했는데 응용하려니 너무 어렵게 느껴지신다면 재밌게 복습해보세요! edu.goorm.io (저는 이런 강의가 너무 설렙니다,,, 하나하나 차근차근 시작해봅시다.) CRUD란? : 기본.. 2021. 1. 1.