Why does JSHint argue against bitwise operators? How should I express this code?

Question

I am using this bit of JavaScript to generate a UID:

(original:)

//If ID has not been defined then generate a new unique ID.
if(!id){
    id = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8); return v.toString(16); });
}

(formatted so it can be read:)

// If ID has not been defined then generate a new unique ID.
if (!id) {
    id = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(
        /[xy]/g, 
        function (c) { 
            var r = Math.random() * 16 | 0, 
                v = c == 'x' ? r : (r & 0x3 | 0x8); 
            return v.toString(16); 
        }
    );
}

JSHint does not like the use of bitwise OR and AND operators. I was wondering how I could rewrite this to be more 'standard friendly.'

EDIT: JSHint states:

Line 8: id = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8); return v.toString(16); });
Unexpected use of '|'.

Line 8: id = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8); return v.toString(16); });
Expected '===' and instead saw '=='.

Line 8: id = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8); return v.toString(16); });
Unexpected use of '&'.

Line 8: id = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8); return v.toString(16); });
Unexpected use of '|'.

Does it show any message in addition "I don't like it"? PS: working with bits using bitwise operators is a standard and friendly way — zerkms, Jul 23 '12 at 00:14

score 70 · Accepted Answer · edited Jan 28 '15 at 10:30

70

Put

/*jshint bitwise: false*/

in the top of your file

A list of available options: http://jshint.com/docs/options/

edited Jan 28 '15 at 10:30

OrangeCMS

55
4

answered Jul 23 '12 at 00:17

zerkms

249,484
69
436
539

58

Doesn't answer the question of _why_. – Snekse Apr 18 '13 at 23:41
10

@Snekse: obviously because bitwise operators are quite rare in JS and most likely user has confused `&&` with `&` – zerkms Apr 18 '13 at 23:51
@zerkms, I'm using VS2012, and this didn't seem to work. The errors still appear. – Matthew Layton Jun 18 '13 at 11:02
@series0ne: ask another question then, with thorough explanation of what you have and what you experience. – zerkms Jun 18 '13 at 11:03
In WebStorm you can also disable this warning directly in *File->Settings->Javascript->Code Quality Tools->JSHint->Enforcing Options->Warn about using bitwise operators*, whitout the need to pollute your source code. – Lucio Paiva Feb 15 '14 at 19:47
@luciopaiva: the advice is more actual for CI servers – zerkms Feb 15 '14 at 19:50
@LucioPaiva what does the _false_ in _bitwise:false_ really do? – Saad Malik Oct 01 '14 at 00:31
@SaadMalik well, it tells JSHint to ignore bitwise operators (i.e., disables the validator, setting it to *false*). Don't know if I understood your question correctly, though. – Lucio Paiva Oct 01 '14 at 04:01
@LucioPaiva what is the difference between _bitwise:false_ and _bitwise:true_ ? The docs mention for _globals_, _false_ = read-only, _true_ = read/write variable. But what does it mean for options? – Saad Malik Oct 01 '14 at 06:32
2

You can also disable it locally by wrapping it around your statement:`/*jshint bitwise: false*/ your statement /*jshint bitwise: true*/` – Ohad Schneider Feb 20 '15 at 10:18
So any code, as good as it may be, needing to parse binary data, or compute a numerical algorithm involving bitwise operations (checksum, hash etc), requires this directive? – bryc Jul 10 '15 at 19:57

score 17 · Answer 2 · answered Jul 01 '16 at 14:44

17

According to JSHint docs, it is because

"Bitwise operators are very rare in JavaScript programs"

As others have mentioned, you can disable the bitwise JSHint option to squelch the warnings.

answered Jul 01 '16 at 14:44

eczajk

447
4
15

5

The only answer that answers the question, and should be accepted. But the reason why JSHint (and TSLint) flags bitwise operations is quite dumb actually. There are proper though rare usage scenarios for bitwise operators, and for these scenarios you never should use anything but bitwise operators. – Risto Välimäki Sep 16 '16 at 08:39

Ned Batchelder · Answer 3 · 2012-07-23T00:27:47.400

6

You've jammed so much code into one line (why??) that you can't tell what jshint is pointing out to you. I've reformatted the code, and I see this:

var r = Math.random() * 16 | 0,

What is the | 0 doing there? It's a needless no-op. UPDATE: seems to be a way to int-ify a float.

Jshint seems to not like other things, but at least get rid of this. And spread your code out so that you (and others) can read it.

edited Jul 23 '12 at 00:27

answered Jul 23 '12 at 00:19

Ned Batchelder

364,293
75
561
662

2

I am just using the second solution provided here: http://stackoverflow.com/questions/105034/how-to-create-a-guid-uuid-in-javascript That perceived no-op exists in this solution with 200+ votes. Is it really not doing anything? EDIT: Yeah, the bitwise OR definitely does something. http://stackoverflow.com/questions/7487977/using-bitwise-or-0-to-floor-a-number – Sean Anderson Jul 23 '12 at 00:22
2

Blah, it could be a weird Javascript way to say, truncate to int. – Ned Batchelder Jul 23 '12 at 00:26
I think that the code should be rewritten to use Math.round(). That incurs an overhead, but would be more clear as to what is happening. – Sean Anderson Jul 23 '12 at 00:27
1

@SeanAnderson - It's a truncate, so `Math.floor` is more appropriate as a replacement. Bitwise OR is also very quick in comparison to `Math.floor`. The reason JSHint / JSLint warn about it, is because they're often typos, and not intentional. – ocodo Dec 28 '12 at 05:41
@SeanAnderson - you'll note that bitwise shifts aren't warned by jslint / jshint, so you shouldn't avoid using bitwise operators. However, try not to be too clever with your code, it becomes a maintenance nightmare. If you have a clearer way to express something, e.g. `Math.floor()` in this instance, use that instead. Avoid premature optimisation. – ocodo Dec 28 '12 at 05:48

score 2 · Answer 4 · answered Oct 17 '17 at 14:57

2

About the "Why argue against bitwise operators". I like this from TSLint docs

Bitwise operators are often typos (...) They also can be an indicator of overly clever code which decreases maintainability.

answered Oct 17 '17 at 14:57

Jaime

488
3
8

score -1 · Answer 5 · answered Apr 21 '16 at 10:58

this works fine for me:

return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g,
    function(c: string) {
        var r = Math.floor(Math.random() * 16), 
            v = c === 'x' ? r : (r % 4 + 4);
        return v.toString(16);          
    }).toUpperCase();

Why does JSHint argue against bitwise operators? How should I express this code?

5 Answers5