JavaScript

javascript | moudule 기본

기본적으로 js 코드를 불러오는 법html코드에 js파일을 다 불러온다.function hello1() { console.log("Hello 1!");}function hello2() { console.log("Hello 2!");}hello1();hello2(); 모듈을 사용하여 js 코드를 불러오는 법만약 불러올 js파일이 10개 이상이면 다 html에 연결을 해줘야하지만,모듈을 사용한다면 main이 되는 파일 하나만 html에 연결해준다.js내에서 다른 js를 포함 시킬 수 있기 때문이다.html에서 script type을 module로 지정해줘야 한다.export function hello1() { console.log("Hello 1!");}export function hello2() {..

JavaScript 2022.09.10

javascript | forEach, map, filter, reduce 메소드, 차이점

이들은 배열의 각 요소에 대해 수행하는 메소드이다.   forEachforEach는 주어진 함수를 배열 요소 각각에 대해 실행한다.간단하게 생각하자면 for 반복문을 대신 사용하는 메소드이다. 참고한 강의의 강사님은 본인의 뇌피셜로 forEach 함수는대충 아래 코드의 주석처리 된 부분과 같이 만들어져 있을거라 하셨다. forEach는 두개의 매개변수를 받는데, 첫번째 매개변수는 콜백할 함수(predicate), 두번째는 thisArg를 받는다.js는 함수형 프로그래밍이 가능하다. 따라서 함수를 매개변수로 넘기는 게 가능하다.두번째 매개변수인 thisArg는 callback을 실행할 때 this로 사용할 값인데 생략할 수 있다./*function forEach(predicate, thisArg){ f..

JavaScript 2022.07.26

javascript | 다중토글 구현하기 - forEach, toggle

See the Pen 다중토글 by sanghee01 (@sanghee01) on CodePen.forEach를 이용해 모든 토글들에게 기능을 적용시킨다.(매개변수 이름은 tog라 지었다)각 토글(tog)이 click 이벤트를 받을 시,만약 현재 내용이 안보인다면 내용이 보이도록 show class ( display:block )를 넣고내용이 보인다면 안보이도록 show class를 제거한다. (default는 css에서 display:none처리를 했다)이 기능은 element.toggle( )를 이용하였다.  cont같은 경우 tog.nextElementSibling이라 작성하였는데,클릭한 tog의 cont 값을 가져오고 싶어서 이렇게 작성하였다.  Element.classList - Web API..

JavaScript 2022.01.20