근혁 study 공부정리

{ const sliderWrap = document.querySelector(".slider__wrap") const sliderImg = document.querySelector(".slider__img") //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") let currentIndex = 0; let sliderCount = slider.length; //이미지 갯수 let sliderHeight = sliderImg.offsetHeight; //이미지 가로값 let sliderClone = slide..

setTimeout()란? 일정 시간 후에 특정 코드, 함수를 의도적으로 지연한 뒤 실행하고 싶을 때 사용하는 함수로 사용한다. 자바스클립트 함수 중에서도 특히 자주 사용되는 함수 중 하나이다. 먼저 간단한 문법부터 알아보자. { setTimeout(function(){ //code here }.시간); } 위 함수는 보통 두 개의 인자를 설정할 때 사용 2. 호출될 콜백함수 2. 지연시간(delay time) setTimeout()함수의 내부에 위차한 코드 function(){//Code here}는 콜백 함수로 지연시간 뒤에 실행될 코드를 설정한다. 지연시간은 밀리세컨드 단위로 설정하며 예를 들어 지연시간 1000=1초, 10000 = 10초를 의미한다. setTimeout활용방법 접속 후 몇 초 후..

{ const sliderWrap = document.querySelector(".slider__wrap") const sliderImg = document.querySelector(".slider__img") //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") let currentIndex = 0; let sliderCount = slider.length; //이미지 갯수 let sliderWidth = sliderImg.offsetWidth; //이미지 가로값 let sliderClone = sliderI..

{ const sliderWrap = document.querySelector(".slider__wrap") const sliderImg = document.querySelector(".slider__img") //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") let currentIndex = -1; //첫 번째 이미지(현재 보이는 이미지) let sliderCount = slider.length //이미지 갯수 setInterval(()=>{ (currentIndex < sliderCount - 1) ? ..

{ // slider01 const sliderWrap = document.querySelector(".slider__wrap") const sliderImg = document.querySelector(".slider__img") const slider = document.querySelectorAll(".slider") let currentIndex = 0; //현재 보이는 이미지 let sliderCount = slider.length; //이미지 갯수 setInterval(() => { //함수를 반복적으로 실행시키고싶을때 씀 let nextIndex = (currentIndex + 1) % 5; //1 2 3 4 0 1 2 3 4 0 되도록 1%(나머지) 5를 써서 slider[currentIn..

{ const searchBox = document.querySelectorAll(".search span") //버튼 const cssList = document.querySelector(".list ul") //속성 리스트 const cssCount = document.querySelector(".count") //css 갯수 //데이터 출력 const updataList = function() { let listHTML = ''; cssProperty.forEach((data, index) => { listHTML += `${data.num}. ${data.name} : ${data.desc}`; //li목록 보이게 cssCount.innerHTML = `전체 목록 갯수 : ${index+1}개`;..

리턴값 함수 return문은 함수에서 결괏값을 반환할 때 사용합니다. 그리고 함수에서 return문이 실행되면 반복문의 break문과 비슷하게 코드가 강제로 종료된다. 다시 말해 함수 정의문에 return문이 사용되면 함수를 호출했을 때 결괏값(data)을 반환한다. 데이터를 반환하고 강제 종료하는 return문 다음은 return문의 기본형이다. 기본형 { function 함수명(){ 자바스크립트 코드1;

함수 데이터를 저장할 때 변수를 선언하여 저장하였습니다. 변수에는 데이터만 저장할 수 있고, 코드는 저장할 수 없다. 하지만 함수를 사용하면 코드를 메모리에 저장했다가 필요할 때마다 호출하여 사용할 수 있다 선언적 함수 함수를 사용하여 코드를 저장한 것을 '함수 정의문'이라고 한다. 변수를 선언할 때 var 키워드를 사용한 것처럼 함수에서 function 키워드를 사용해 변수를 선언한다. 함수 정의문은 다음과 같이 선언한다. 기본형 : { function 함수명(){ 자바스크립트 코드; } 함수 정의문({...}) 안에 작성된 코드는 즉시 실행되지 않는다 함수는 메모리에 할당되어 대기하고 있다가 함수가 호출되면 실행합니다. 정의되어 있는 함수를 호출하는 기본형은 다음과 같다. { 기본형 : 함수명 = (..