js 버튼을 클릭할때마다 배열값을 1개씩 어떻게 늘릴까요?

Question

js 버튼을 클릭할때마다 배열값을 1개씩 어떻게 늘릴까요?

조회수 737회

video

javascript

0

싫어요

버튼을 클릭할 때마다 트랙 인덱스를 한개씩 늘려 트랙 변경을 어떻게 할까요?

아래 코드 실행시 모든 라벨이 Member7인 것만 트랙이 변경되고 나머지는 모두 false가 됩니다..

var tracks = video.videoTracks;
testbutton.onclick = () => {
    for (i = 0; i < tracks.length; i++) {
        if (tracks[i].label === "Member7") {
            tracks[i].selected = true;
        } else {
            tracks[i].selected = false;
        }
    }
};

VideoTrackList {0: VideoTrack, 1: VideoTrack, 2: VideoTrack, 3: VideoTrack, 4: VideoTrack, 5: VideoTrack, 6: VideoTrack, 7: VideoTrack, length: 8, selectedIndex: 0, onchange: null, onaddtrack: null, onremovetrack: null, …}

비디오 트랙입니다.

댓글 입력

score 0 · Accepted Answer

지금 "Track7" 같은 걸 코드에 명시하고 계신데 이런 식이면 답이 없습니다. 트랙이 7개 이상이 될지 이하가 될지 누가 알겠어요?

혹시 지금 하시려는 것이, 주어진 재생목록에서 원래 2번째였던 것은 1번째로 만들고, 원래 3번째였던 것은 2번째로 만들고... 그리고 원래 1번째였던 것은 맨 끝의 것으로 만들려고 하시는 거라면, 저라면 shift 개념으로 접근하겠습니다. JS Array의 shift()가 어떻게 동작하는지 살펴보시면, 대충 아래 코드와 같은 방식이 일리가 있다는 걸 알 수 있을 겁니다.

getNextTrackButton.onclick = () => {
    let firstTrack = video.videoTracks.shift();
    video.videoTracks.push(firstTrack);
    // 이 시점에서 video.videoTracks는 2, 3, 4, ..., 1 형태의 배열로 바뀌어 있음
};

반대 방향이라면 unshift를 찾아보시면 됩니다. 아무튼 이런 식의 접근법은 배열 전체를 기계적으로 순환하므로, "Track7" 같은 걸 코드에 하드코딩할 필요가 없다는 이점이 있습니다. 한번 조사해 보세요!