💡 slice() 배열 메서드 slice() 메서드는 배열의 복사본을 만들거나 배열의 일부를 반환하는 데 사용할 수 있다. slice() 메서드는 원래 배열을 변경하지 않고 대신 얕은 복사본을 생성한다는 점에 유의해야 한다. 기본 구문은 다음과 같다. slice(optional start parameter, optional end parameter) 이 예시에서는 과일 목록을 만들었다. const fruits = ['apple', 'banana', 'mango', 'melon']; slice() 메서드를 매개변수 없이 사용하는 방법 ❓ slice() 메서드를 활용해 해당 배열의 얕은 복사본을 만들 수 있다. console.log(fruits.slice()); // ['apple', 'banana', 'm..

📖 들어가며 자바스크립트로 프로그래머스의 스택(Stack) 자료구조를 이용하는 '기능개발' 문제(LV.2) 풀이를 하겠다. ❓ 문제 문제 설명 프로그래머스 팀에서는 기능 개선 작업을 수행 중입니다. 각 기능은 진도가 100% 일 때 서비스에 반영할 수 있습니다. 또, 각 기능의 개발속도는 모두 다르기 때문에 뒤에 있는 기능이 앞에 있는 기능보다 먼저 개발될 수 있고, 이때 뒤에 있는 기능은 앞에 있는 기능이 배포될 때 함께 배포됩니다. 먼저 배포되어야 하는 순서대로 작업의 진도가 적힌 정수 배열 progresses와 각 작업의 개발 속도가 적힌 정수 배열 speeds가 주어질 때 각 배포마다 몇 개의 기능이 배포되는지를 return 하도록 solution 함수를 완성하세요. 제한사항 작업의 개수(prog..

📖 들어가며 안녕하세요. 오늘은 자바스크립트에서 버튼 클릭으로 오디오를 제어하는 방법에 대해서 정리하려고 합니다. 버튼 클릭으로 음악을 켜고 끄고, 다음 음악으로 넘기는 여러 음악을 제어하는 기능을 구현하면서 HTML에는 audio태그를 사용하지 않고, 오직 자바스크립트에서만 audio 제어를 했다가 막혔지만, 결국 잘 해결을 해서 따로 정리하게 됩니다. 아주 간단한 예를 들어서, const audio = new Audio('audio_file.mp3'); audio.play(); HTML에 따로 오디오 태그를 작성하지 않고 이런 식으로 audio 코딩을 해서 로컬에서 잘 작동하는 것을 확인하고, 깃허브 퍼블리싱을 하여 사이트로 배포하니깐 아래와 같은 오류로 오디오 재생이 작동하지 않는 것을 확인했습니다..

📖 들어가며 자바스크립트를 이용한 회원가입, 약관 동의 예제를 검색하면 jQuery를 이용한 예제가 많은데, 요즘에는 jQuery를 많이 사용하지 않는 추세이고, 순수 Vanilla 자바스크립트를 사용하며 공부하는 것이 매우 도움이 되기 때문에 jQuery 없이 순수 Vanilla 자바스크립트를 이용하여 예제를 만들어 보겠습니다. 완성 화면 HTML 구성 JUN { item.checked = true; agreements[item.id] = true; item.parentNode.classList.add('active'); }); } item(체크박스)의 checked를 true로 변경합니다. ( checked를 true를 주면 체크 박스는 체크가 됨.) 그다음 위에서 작성한 Object에서 체크박스의 ..

📖 들어가며 내가 최근에 Vanilla JavaScript를 공부하면서 알게 된 것이 바로 자바스크립트 ES6 문법인 구조 분해 할당(Destructuring)이다. 구조 분해 할당(Destructuring) 객체 구조 분해를 이용하여 변수를 작성하게 되면, 배열이나, 객체를 이용한 변수가 간결하면서도 보기 쉽게 작성할 수 있어서 유용하다. 그래서, 이번에는 간단하게 구조 분해 할당(Destructuring), 객체 구조 분해가 무엇이고, 어떻게 사용해야 하는지 정리해보겠다. 1. 구조 분해 할당(Destructuring)이란 ❓ 구조 분해 할당 구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식이다. -(MDN) 이로서 배열이나 객체를 변수에 담아..