【JavaScript】長い文字列を定数・変数に置き換えたい

JavaScript

前回使っていたJavaScriptのコードでは、以下のような書き方になっていました。

'use strict';
document.getElementById('target').addEventListener('click',function(){
  document.getElementById('target').style.background = 'pink';
})

しかし、これでは何度も

document.getElementById('target')

を書かないといけないため、

  • 変更する際に全てを書き換えなければいけない
  • 文字列が長くコードの見通しが悪い

などデメリットが多いです。

そこで定数や変数を使用して文字列を置き換えることによって、上記のデメリットを解決することができます。

以下は定数を使用した置き換え例。

'use strict';

const target = document.getElementById('target')　★

target.addEventListener('click',function(){
  target.classList.toggle('circle');
})