emayom.log

재귀,,, 우리 재귀는요 데이터 구조를 검색할 때도 유용하구요,,⭐️ 재귀는 강력한 함수형 기법이다. 하지만? 그래.알아보자. 재귀 (recursion) 재귀를 사용하면 코드가 짧아지고 코드 이해도가 높아지며 유지보수에도 이점이 있습니다. 모든 곳에서 메모리 최적화를 신경 써서 코드를 작성해야 하는 것은 아닙니다. 우리가 필요한 것은 좋은 코드입니다. 이런 이유 때문에 재귀를 사용합니다. 재귀는 자기 자신을 호출하는 함수를 만드는 기법이다. 기본적으로 재귀는 반복문과 동일한 결과?를 얻을 수 있지만 단순화하여 훨씬 간결하게 표현할 수 있다는 장점이 있다. map, filter, reduce와 같은 함수들은 파라미터로 다른 함수(콜백 함수)를 받는 고차 함수다. 만약 함수에서 다른 함수를 호출해야하는데 그..

이전 포스팅에서 함수 선언식과 표현식에 대해 알아봤다! 함수 표현식을 이용해서 함수를 보다 가독성 있게 표현할 수 있었다. 하지만, 화살표 함수를 사용하면 표현식을 좀 더 간결하게 표현할 수 있다. 🤔 (그럼 선언식은 ?????) 이전 포스팅에서 알아본 함수 표현식을 다시 한번 확인해보자. 함수 선언식과 비교해보면 음 나름 가독성 있는 ? 코드처럼 보인다. //함수 선언식 //function 키워드로 단독으로 함수를 선언한 것! function sum (a, b) { return a + b; }; //함수 표현식 //변수를 함수에 할당한 것 const sum = function(a, b) { return a + b; }; 화살표 함수 ? 익명 함수 ? 화살표 함수는 ES6에 새로 추가된 유용한 기능으로 ..

자바스크립트에서는 함수를 만들 때 사용할 수 있는 여러가지 문법이 있다. 오늘은 함수 선언식과 함수 표현식의 차이점에 대해 알아보자. 🤔 함수 선언식(Function Declarations) ? 함수 선언식은 자주 보게되는 기본적인 형태를 띄고 있다. 함수 선언 또는 함수 정의는 function 키워드로 시작한다. 그 뒤로 함수의 이름을 적고, 중괄호 사이에 함수의 기능?을 적게된다. function handleIt() { console.log("I can handle it!!"); } handleIt(); 함수 표현식 (Function Expression) ? 함수를 만드는 다른 방법으로 함수 표현식이 있다. 유연한 자바스크립트의 특징을 활용한 선언 방식으로 함수 표현식은 익명 함수를 만들며, 변수에 ..

오늘은 자바스크립트 ES6에 추가된 배열 메서드 Array.from()에 대해서 알아보자! 🦖🦕 ... 우선 쉽게 예제로 바로 들어가 보자. 우연히 모던 자바스크립트 강의를 보다가 풀게 된 문제인데 내용은 아래와 같다. html 내부에 ul 태그를 살펴보면 문자열을 가진 li 요소들이 있다. 요소들을 자바스크립트 코드로 "e"를 포함한 요소들만 배열로 리턴하는 함수를 만들어라! (Array.from(), filter(), includes()를 사용!) 이걸 보시는 분이 계시다면,,,, 한 번 풀어보길 추천한다,,,,! ✳︎ let lists = document.querySelectorAll("li")으로 li 모두를 가져오게 되면 lists는 우리가 생각하는 배열이 아닌 NodeList라고 하는 유사 배..

자바스크립트에서 html DOM에 접근하여 제어하기 위해 getElementById, querySelector, querySelectorAll 등의 Document 메소드를 통해 객체를 가져온다. querySelector ? getElementById는 주어진 id를 가진 엘리먼트(요소)를 찾아오지만, querySelector의 경우 id 혹은 class 중 주어진 선택자에 만족하는 요소를 찾아올 수 있다! //id 선택자 document.querySelector("#id"); //class 선택자 document.querySelector(".class"); 유의해야 할 점은 중복되는 id를 가진 경우 첫 번째의 요소만을 가져올 수 있는 것이다. 그렇다면 같은 선택자를 가진 모든 요소를 가져오고 싶을 때..

우연히 버튼 인터랙션 디자인을 보다가 클릭했을 때 지정한 시간동안 색이 변하게 설정해보고싶었다! 1. 결과 : 다른 버튼이 클릭되었을 때 중복되어 색이 변하는 이벤트가 발생하는 문제가 생겼다 ㅠㅠ 처음에는 자바스크립트로 버튼 클릭 이벤트가 있을 때 이벤트 타겟에 classList.add()로 클래스를 추가하고, 미리 CSS에 해당 클래스의 스타일 요소를 시트의 마지막에 설정해둔 뒤 추가되었을 때 나타나게 해주었다. 그리고 setTimeout을 지정해 시간이 지나면 클래스가 삭제되도록 실행해봤다. 2. 결과 : ㅠㅠ 시간차가 있어도 같은 버튼을 클릭하면 다른 버튼을 클릭하기 전까지 색이 변하지 않는다,, 클릭한 하나의 버튼만 배경색을 변경하고 싶었기 때문에 ..! 시간이 지나면 서서히 원래의 배경색으로 돌..

[Javascript] 프로그래머스 Level1 _ 나누어 떨어지는 숫자 배열 👇🏻 Link_Click 👇🏻 시행착오 ( + 코드를 작성하면서든 생각들.) 1. 반복문을 이용해 배열을 돌며 divisor로 나누어 떨어지는 수 들을 리턴했다. LENGTH를 선언한 것은 반복문에서 Array.length를 사용할 경우 반복문이 실행될 때마다 배열의 length를 구하는 작업을 하게 되어 결론적으로는 성능에 좋지 못하다는 글을 우연히 봤다. (아래에 링크를 걸어 두었다!) 아직 그런 걸 확인할 수 있을 만큼 깊이가 있지는 않지만ㅎㅎㅎㅎ 봤으니 나쁜 습관이 되기 전에 고쳐보려고 한다! function solution(arr, divisor) { const LENGTH = arr.length; let answer..