javascript (29) 썸네일형 리스트형 TIL no.8 - forEach method :JavaScript forEach는 주어진 함수를 배열 요소 각각에 대해 실행하는 메서드이다. arr.forEach(callback(currentvalue[, index[, array]])[, thisArg]) 배열에 대한 반복문이라고 이해할 수 있습니다. 배열의 각 요소에 대해 callback을 실행합니다. 배열을 변형하지 않기 때문에 중간에 break; 문을 사용할 수 없습니다. 중간에 멈춰야 하는 경우엔 forEach()는 적절하지 않기 때문에 for()문을 사용해야 합니다. for 반복문을 forEach() 로 바꾸기 1 let members = ['최하늘', '김지선', '박아인']; for (var i = 0; i < members.length; i++) { member = members[i]; System.ou.. TIL no.7 - appendChild 함수 앞 뒤 html에서 이렇게 구현되게 하기 위해서 이를 javascript로 function cardSetting(row, column) { for (var i = 0; i < row * column; i++) { var card = document.createElement('div'); card.className = 'card'; var cardInner = document.createElement('div'); cardInner.className = 'cardInner'; var cardFront = document.createElement('div'); cardFront.className = 'card-front'; var cardBack = document.createElement('div'); c.. TIL no.5 - Javascript 기초 공부 정리[2] Strings "hi " + "goodbye" -> "hi goodbye" 자바스크립트 이스케이프 문자는 모두 백 슬래시로 시작하며 문자열에서 탈출하여 문자열에 유효하지 않은 특수 문자를 작성하는 방법입니다. "she said \"goodbye! \" " -> "she said "goodbye! " " Variable 변수 var : 가변적이다. 변수를 선언하고 같은 변수에 다른 값을 선언했을 때, 새로운 값으로 덮어 씌워진다. undefined는 아무 것도 뜻하지 않는다는 의미 alert(''); console.log(''); prompt(""); Logical Operators -AND, OR, and NOT &&(AND) 양면이 다 참인 경우 x < 10 && x !== 5 : x가 10보다 작고 .. TIL no.4 - Javascript 기초 공부 정리[1] wecode 사전 스터디 3주차로 JavaScript 미니게임을 만들기 전에 이론을 더 공부해야겠다고 생각했습니다. 그래서 일단 예시로 주어진 순수 자바스크립트를 이용한 2D 벽돌깨기 게임을 공부하면서 배운 이론을 정리하려고 합니다. 아직 자바스크립트로는 기초적인 이론만 배운 상태라 활용하기가 어려운 실력이라서 그런지.. 코드를 보고 따라하면서도 이 코드를 보지 않았어도 이것을 구현해내기 위해 이 코드를 만들 수 있었을지 의문이 드네요.. 그래도 열심히 알려고 노력하다보면 나중엔 답이 보이지 않을까..싶습니다 🤩💪🏻 setInteval 함수 : 일정한 시간 간격으로 작업을 수행하기 위해서 사용합니다. clearInteval 함수를 사용하여 중지할 수 있습니다. setTimeout 함수 : 일정한 시간 후.. TIL no.2 - Element.scrollIntoView() id만 알고 querySelector, getElementId 를 이용해서 그 element를 가지고 오면 그 element 자체에 있는 scrollIntoView를 이용해서 스크롤이 가능하게 해준다. 즉, 엘리먼트 자체에 있는 인터페이스로 엘리먼트의 parent 컨테이너에 스크롤이 된다. 이 기능을 사이트에서 navbar를 만들 때 각각의 section으로 스크롤이 되는 기능을 추가하기 위해 사용할 수 있습니다. Home About Skills Contact 이 엘리먼트를 id로 가져와 스크롤하여 각각의 위치로 가게 하기 위해 이와 같이 script 부분을 작성할 수 있습니다. HTMLElement.dataset 속성도 사용되었는데 이것은 읽기 전용 속성으로 사용자 지정으로 (data-*)을 작성하고 .. 이전 1 2 3 4 다음
