1

I recently integrated this hash function into my react web app, here is the code:

const cyrb53 = function(str, seed = 0) {
    let h1 = 0xdeadbeef ^ seed, h2 = 0x41c6ce57 ^ seed;
    for (let i = 0, ch; i < str.length; i++) {
        ch = str.charCodeAt(i);
        h1 = Math.imul(h1 ^ ch, 2654435761);
        h2 = Math.imul(h2 ^ ch, 1597334677);
    }
    h1 = Math.imul(h1 ^ h1>>>16, 2246822507) ^ Math.imul(h2 ^ h2>>>13, 3266489909);
    h2 = Math.imul(h2 ^ h2>>>16, 2246822507) ^ Math.imul(h1 ^ h1>>>13, 3266489909);
    return 4294967296 * (2097151 & h2) + (h1>>>0);
};

One change I made to the code is that I have placed this within a utils file so that this function can be called by multiple components. Here are my slight changes:

export function cyrb53(str, seed = 0) { // <- this is the only change I made to integrate this within my apps architecture
    let h1 = 0xdeadbeef ^ seed, h2 = 0x41c6ce57 ^ seed;
    for (let i = 0, ch; i < str.length; i++) {
        ch = str.charCodeAt(i);
        h1 = Math.imul(h1 ^ ch, 2654435761);
        h2 = Math.imul(h2 ^ ch, 1597334677);
    }
    h1 = Math.imul(h1 ^ h1>>>16, 2246822507) ^ Math.imul(h2 ^ h2>>>13, 3266489909);
    h2 = Math.imul(h2 ^ h2>>>16, 2246822507) ^ Math.imul(h1 ^ h1>>>13, 3266489909);
    return 4294967296 * (2097151 & h2) + (h1>>>0);
};

I am receiving the following error in my Firefox browser console:

  Line 95:23:  Unexpected mix of '^' and '>>>'  no-mixed-operators
  Line 95:27:  Unexpected mix of '^' and '>>>'  no-mixed-operators
  Line 95:61:  Unexpected mix of '^' and '>>>'  no-mixed-operators
  Line 95:65:  Unexpected mix of '^' and '>>>'  no-mixed-operators
  Line 96:23:  Unexpected mix of '^' and '>>>'  no-mixed-operators
  Line 96:27:  Unexpected mix of '^' and '>>>'  no-mixed-operators
  Line 96:61:  Unexpected mix of '^' and '>>>'  no-mixed-operators
  Line 96:65:  Unexpected mix of '^' and '>>>'  no-mixed-operators

Looking at W3 docs, I understand that ^ and >>> operators are for math operations with bytes. Nonetheless I am a unfamiliar with math with bytes in javascript. What is the proper way of resolving this warning?

EDIT:

The accepted answer links another answer and this was flagged as a duplicate, but this topic is slightly different. I asked, "What is happening with my Javascript code (not JSX)" and the answer was "This is actually a eslint warning--not Javascript--and here is a solution."

Justapigeon
  • 560
  • 1
  • 8
  • 22
  • Does this answer your question? [Mixed operators in JSX](https://stackoverflow.com/questions/41899606/mixed-operators-in-jsx) – Çağatay Sel Jul 18 '20 at 19:06
  • 1
    @CagataySel No, it was not clear in that question that the issue was NOT a javascript error. (And that question is discussing JSX and different operators.) Your answer more clearly addresses my question, thank you! – Justapigeon Jul 18 '20 at 19:11

1 Answers1

4

It is not a javascript error but an eslint warning.

See this answer to get rid of the warning.

Code with solution (use parentheses):

export function cyrb53(str, seed = 0) {
    let h1 = 0xdeadbeef ^ seed, h2 = 0x41c6ce57 ^ seed;
    for (let i = 0, ch; i < str.length; i++) {
        ch = str.charCodeAt(i);
        h1 = Math.imul(h1 ^ ch, 2654435761);
        h2 = Math.imul(h2 ^ ch, 1597334677);
    }
    h1 = Math.imul(h1 ^ (h1>>>16), 2246822507) ^ Math.imul(h2 ^ (h2>>>13), 3266489909); // <- added parentheses here
    h2 = Math.imul(h2 ^ (h2>>>16), 2246822507) ^ Math.imul(h1 ^ (h1>>>13), 3266489909); // <- and added parentheses here; its not much but it is honest work
    return 4294967296 * (2097151 & h2) + (h1>>>0);
};
Justapigeon
  • 560
  • 1
  • 8
  • 22
Çağatay Sel
  • 801
  • 7
  • 14
  • If linking another answer from a Q&A answers the question then this question should be voted to be closed as a duplicate instead of answered with a link. – Patrick Evans Jul 18 '20 at 19:04
  • 1
    Thank you! Parentheses fixed the issue. I will accept once the 10-minute wait period has elapsed, thank you for your swift solution! – Justapigeon Jul 18 '20 at 19:04
  • @PatrickEvans one unique addition I learned with this answer (unlike the linked answer, which I had viewed and moved-on from as I wasn't writing with JSX) is that this is not a Javascript issue. That is not outlined in the linked answer as clearly as here, so I vote this is a novel contribution to the community. – Justapigeon Jul 18 '20 at 19:06