자바스크립트를 사용하여 웹 페이지에서 오디오를 재생하는 방법은 여러 가지가 있습니다. 그 중에서 Nullish Coalescing 연산자를 활용하면 변수가 null 또는 undefined인 경우에 대해 간단하게 처리할 수 있습니다.

Nullish Coalescing은 ES2020에서 도입된 새로운 연산자로, 주어진 표현식이 null 또는 undefined인 경우 제공된 기본값을 반환합니다. 이를 사용하여 변수가 null 또는 undefined일 때 오디오를 재생하도록 코드를 작성해보겠습니다.

오디오 재생 처리 코드

먼저, HTML에서 오디오 요소를 생성합니다. 아래 예제에서는 audio 태그를 사용하겠습니다.

<audio id="audioElement">
  <source src="audio.mp3" type="audio/mpeg">
  Your browser does not support the audio element.
</audio>

다음으로, 자바스크립트 코드를 작성하여 오디오를 재생하는 함수를 만듭니다.

function playAudio() {
  const audio = document.getElementById('audioElement');

  if (audio && audio.paused) {
    audio.play();
  }
}

위 코드에서는 getElementById 메소드를 사용하여 오디오 요소를 가져옵니다. 그 후, Nullish Coalescing 연산자를 사용하여 audio 변수가 null 또는 undefined인 경우에 대해 처리합니다.

audio.paused 속성은 오디오 요소가 일시정지 상태인지를 나타내는 불린 값을 반환합니다. 오디오가 일시정지 상태라면 play() 메소드를 호출하여 재생할 수 있습니다.

실행 예제

아래는 위의 코드를 실행하는 예제입니다.

playAudio(); // 오디오 재생

위 코드는 playAudio 함수를 호출하여 오디오를 재생합니다. 만약 오디오 요소가 null 또는 undefined인 경우에는 오류가 발생하지 않고 넘어갑니다.

이와 같이 Nullish Coalescing을 활용하면 오디오 재생 코드를 보다 간단하게 작성할 수 있습니다. 해당 방법은 자바스크립트에서 변수가 null 또는 undefined인 경우를 처리할 때 유용하게 사용할 수 있습니다.

#JS #JavaScript #NullishCoalescing #오디오 #재생