Found confusing multiline expressions JS-0024
Bug risk
5 months ago
—
5 months old
Unexpected newline between object and [ of property access.
10627 var a = arguments,
10628 n = M.replaceTarget ? "replaceWith" : "html";
10629 q(M.target)
10630 [n](e)10631 .each(function () {
10632 d.apply(this, a);
10633 });Unexpected newline between object and [ of property access.
8051 var duration = Drupal.webform.states[effect].duration;
8052 $(e.target)
8053 .closest(".js-form-item, .js-form-submit, .js-form-wrapper")
8054 [effect](duration); 8055 }
8056 });
8057 Drupal.states.State.aliases["invisible-slide"] = "!visible-slide";Unexpected newline between object and [ of property access.
8168 var duration = Drupal.webform.states[effect].duration;
8169 $(e.target)
8170 .closest(".js-form-item, .js-form-submit, .js-form-wrapper")
8171 [effect](duration); 8172 }
8173 });
8174 Drupal.states.State.aliases["invisible-slide"] = "!visible-slide";Unexpected newline between object and [ of property access.
11124 var a = arguments,
11125 n = M.replaceTarget ? "replaceWith" : "html";
11126 q(M.target)
11127 [n](e)11128 .each(function () {
11129 d.apply(this, a);
11130 });Unexpected newline between object and [ of property access.
8548 var duration = Drupal.webform.states[effect].duration;
8549 $(e.target)
8550 .closest(".js-form-item, .js-form-submit, .js-form-wrapper")
8551 [effect](duration); 8552 }
8553 });
8554 Drupal.states.State.aliases["invisible-slide"] = "!visible-slide";
Description
It is recommended to use a multiline expression with proper use of newlines; otherwise, it can cause confusion and have a different outcome than what the developer intended.
Consider the following code-snippet:
someFuncCall()
[2].concat([3])
The two lines are being interpreted as one expression i.e
someFuncCall()[2].concat([3])
This might even throw a runtime error if someFuncCall() does not return a multi-dimensional array.
Bad Practice
const upperLimit = limit
(1 || 2).get();
const hello = 'world'
[1, 2, 3].forEach(addNumber);
const x = function() {}
`hello`
const y = function() {}
y
`hello`
const z = upperLimit
/regex/g.test(limit)
Recommended
const upperLimit = limit;
(1 || 2).get();
// Two different expression separated using semi-colon
const upperLimit = limit
;(1 || 2).get()
const hello = 'world';
[1, 2, 3].forEach(addNumber);
const x = function() {};
`hello`
const tag = function() {}
tag `hello`