문자 중간에 변수를 집어 넣고 싶을때 질문입니다.

[이현지]

문자 중간에 변수를 집어넣고 싶을때 공식이

var count = 1;

console.log('문자' + count + '문자');

console.log(`문자${count}문자`)

이거라고 하셧는데 응용문제 풀때 보면
translateX(-'+지금사진+'00vw) 요게 정답이던데

위에 공식대로면 translateX('-'+지금사진+'00vw') 이거 아닌가요?

왜 이렇게는 작동하지않나요?

그리고 
위의 공식대로
translateX(`-${지금사진}00vw`)이렇게 작성했을때는 코드가 실행 되지 않고

`translateX(-${현재사진}00vw)` 이렇게 사용해야되던데 이유가 무엇일까요?

[codingapple]

translateX( 부분도 전부 문자로 담아줘야할듯요

[이현지]

그리고 위의 공식대로 사진 갯수와 상관없이 다음버튼을 누르면 되게 코드를 짯을때 이전버튼을 만들면

var  지금사진 = 1;

$('.next-btn').on('click', function(){
  $('.slide-container').css('transform', `translateX(-${지금사진}00vw)`);
  지금사진 ++;
});

$('.before-btn').on('click', function(){
$('.slide-container').css('transform', `translateX(+${지금사진}00vw)`);
지금사진 --;
});

이렇게 짜는건줄 알았는데 오류먹어서 다망가지더라구요 어떻게 다르게 써야하는건가요?

[이현지]

 그럼 console.log(`문자${count}문자`) 가 아니라 `console.log(문자${count}문자)` 인거죠?

그리고
console.log('문자' + count + '문자') 요렇게 알려주셧는데

translateX('-'+지금사진+'00vw') 요건 왜 틀린건가요?

[이현지]

아해결했습니다!

var 현재사진 = 1;
$('.next-btn').on('click', function() {
현재사진 ++;
$('.slide-container').css('transform', 'translateX(-'+(현재사진-1)+'00vw)')
});
$('.before-btn').on('click', function(){
현재사진 --;
 $('.slide-container').css('transform', 'translateX(-'+(현재사진-1)+'00vw)')
        })

이렇게하면 되던데 근데 첫번째사진에서 한번더 이전버튼을 누른후에 다음버튼을 누르면 바로 안넘어가고 두번눌러야하던데 이건
어떻게 개선할수잇을까요?
이런저런 방법을 찾아봤는데 다음버튼을 여러번 누르고 이전으로 돌아갈때 한번에 가는건 알겠는데 이전버튼을여러번누르고 다음으로 넘어갈땐 한번에 넘어가지않아요

[codingapple]

현재사진 변수를 1 미만으로 감소하지 않게 if문을 쓰거나 하는게 좋을듯요

[글쓴이]

글