Execute function conditionally with && syntax JS

Question

Can I execute functions this way?

const test = testFunc() // returns "value" or undefined

test && anotherFunction()

Basically I want to execute anotherFunction() if test const is defined, otherwise just skip it.

I know that I can use something like this:

if (test) {
    anotherFunction()
}

but I'm interested why the first method isn't working.

I will appreciate if someone explain me the difference between if () {} and &&.

// I'm confused because if I trying to use the first method I get:

Expected an assignment or function call and instead saw an expression

in my IDE.

If `testFunc()` returns `undefined` then `anotherFunction()` will not be called. — Pointy, Jun 04 '20 at 19:07
@jay_dtr And that is the behavior you get. So what is your question? — Ivar, Jun 04 '20 at 19:10
Does this answer your question? [Javascript AND operator within assignment](https://stackoverflow.com/questions/3163407/javascript-and-operator-within-assignment) — agrm, Jun 04 '20 at 19:10
You're likely just thinking `testFunc()` is returning something, even though it's not. If you're not sure, put its code in a snippet and edit your post. — Yannick K, Jun 04 '20 at 19:10
@Ivar `Expected an assignment or function call and instead saw an expression` in my IDE if I use the first method — Andrew, Jun 04 '20 at 19:12
@jay_dtr [I cannot replicate that](https://jsfiddle.net/bqj3f5t7/1/). — Ivar, Jun 04 '20 at 19:14
It is a rule with your linter. It is expecting the value to be stored into a variable. So if you want to use that pattern change the rule in your linter https://eslint.org/docs/rules/no-unused-expressions — epascarello, Jun 04 '20 at 19:14
@epascarello, you are right, this is probably the case. But the question remains - can I use it like this, or it is not a good practice? — Andrew, Jun 04 '20 at 19:23
You can use it if you change your linter to allow it. The page has the settings to enable to allow that syntax. — epascarello, Jun 04 '20 at 19:24
@jay_dtr If you have to read through a lot of code and come across this part, which of those would you find more clear/obvious? — Ivar, Jun 04 '20 at 19:28
@Andrew if you got help on the below answer, kindly accept and vote so it will be helpful for future reference — Learner, Aug 08 '20 at 11:16

Learner · Answer 1 · 2020-06-04T19:14:10.573

1

The approach will work as expected you can see the below two cases as you mentioned.

First Case - testFunc returns some value

const testFunc = () => 1

const anotherFunction = () => 2

const test = testFunc()

test && anotherFunction()

Second Case - testFunc returns undefined

const testFunc = () => undefined

const anotherFunction = () => 2

const test = testFunc() 

test && anotherFunction()

I hope this will help to understand it better.

edited Jun 04 '20 at 19:14

answered Jun 04 '20 at 19:12

Learner

8,379
7
44
82

Your second case looks exactly the same as the first case – Pointy Jun 04 '20 at 19:13

Execute function conditionally with && syntax JS

1 Answers1