Use template literals instead of concatenation

twbs · Mar 27, 2021 · 2b60cac · 2b60cac
1 parent 232e392
commit 2b60cac
Show file tree

Hide file tree

Showing 6 changed files with 14 additions and 17 deletions.
diff --git a/js/src/collapse.js b/js/src/collapse.js
@@ -72,8 +72,7 @@ class Collapse extends BaseComponent {
     this._isTransitioning = false
     this._config = this._getConfig(config)
     this._triggerArray = SelectorEngine.find(
-      `${SELECTOR_DATA_TOGGLE}[href="#${this._element.id}"],` +
-      `${SELECTOR_DATA_TOGGLE}[data-bs-target="#${this._element.id}"]`
+      `${SELECTOR_DATA_TOGGLE}[href="#${this._element.id}"],${SELECTOR_DATA_TOGGLE}[data-bs-target="#${this._element.id}"]`
     )
 
     const toggleList = SelectorEngine.find(SELECTOR_DATA_TOGGLE)

diff --git a/js/src/modal.js b/js/src/modal.js
@@ -474,7 +474,7 @@ class Modal extends BaseComponent {
         const actualValue = element.style[styleProp]
         const calculatedValue = window.getComputedStyle(element)[styleProp]
         Manipulator.setDataAttribute(element, styleProp, actualValue)
-        element.style[styleProp] = callback(Number.parseFloat(calculatedValue)) + 'px'
+        element.style[styleProp] = `${callback(Number.parseFloat(calculatedValue))}px`
       })
   }
 

diff --git a/js/src/popover.js b/js/src/popover.js
@@ -28,11 +28,11 @@ const Default = {
   offset: [0, 8],
   trigger: 'click',
   content: '',
-  template: '<div class="popover" role="tooltip">' +
-              '<div class="popover-arrow"></div>' +
-                '<h3 class="popover-header"></h3>' +
-              '<div class="popover-body"></div>' +
-            '</div>'
+  template: `<div class="popover" role="tooltip">
+              <div class="popover-arrow"></div>
+              <h3 class="popover-header"></h3>
+              <div class="popover-body"></div>
+            </div>`
 }
 
 const DefaultType = {

diff --git a/js/src/tooltip.js b/js/src/tooltip.js
@@ -71,10 +71,10 @@ const AttachmentMap = {
 
 const Default = {
   animation: true,
-  template: '<div class="tooltip" role="tooltip">' +
-              '<div class="tooltip-arrow"></div>' +
-              '<div class="tooltip-inner"></div>' +
-            '</div>',
+  template: `<div class="tooltip" role="tooltip">
+              <div class="tooltip-arrow"></div>
+              <div class="tooltip-inner"></div>
+            </div>`,
   trigger: 'hover focus',
   title: '',
   delay: 0,

diff --git a/js/src/util/index.js b/js/src/util/index.js
@@ -48,7 +48,7 @@ const getSelector = element => {
 
     // Just in case some CMS puts out a full URL with the anchor appended
     if (hrefAttr.includes('#') && !hrefAttr.startsWith('#')) {
-      hrefAttr = '#' + hrefAttr.split('#')[1]
+      hrefAttr = `#${hrefAttr.split('#')[1]}`
     }
 
     selector = hrefAttr && hrefAttr !== '#' ? hrefAttr.trim() : null
@@ -128,9 +128,7 @@ const typeCheckConfig = (componentName, config, configTypes) => {
 
     if (!new RegExp(expectedTypes).test(valueType)) {
       throw new TypeError(
-        `${componentName.toUpperCase()}: ` +
-        `Option "${property}" provided type "${valueType}" ` +
-        `but expected type "${expectedTypes}".`
+        `${componentName.toUpperCase()}: Option "${property}" provided type "${valueType}" but expected type "${expectedTypes}".`
       )
     }
   })

diff --git a/js/src/util/scrollbar.js b/js/src/util/scrollbar.js
@@ -35,7 +35,7 @@ const _setElementAttributes = (selector, styleProp, callback) => {
       const actualValue = element.style[styleProp]
       const calculatedValue = window.getComputedStyle(element)[styleProp]
       Manipulator.setDataAttribute(element, styleProp, actualValue)
-      element.style[styleProp] = callback(Number.parseFloat(calculatedValue)) + 'px'
+      element.style[styleProp] = `${callback(Number.parseFloat(calculatedValue))}px`
     })
 }