Why does Array.filter(Number) filter zero out in JavaScript?












12














I'm trying to filter all non-numeric elements out from an array. We can see the desired output when using typeof. But with Number, it filters zero out.



Here's the example (tested in Chrome Console):



[-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(Number)

// Which output with zero filtered out:

[-1, 1, 2, 3, 4]  // 0 is filtered


If we use typeof, it doesn't filter zero, which was expected.



// code

[-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(n => typeof n === 'number')

// output

[-1, 0, 1, 2, 3, 4, 0]


My question:




  1. What is the difference between the 'Number' and 'typeof' approaches?


  2. Number filters zero, but 'Number' itself literally contains zero, and this confuses me.







javascript numbers typeof







share|improve this question









New contributor




imckl is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.

























    12














    I'm trying to filter all non-numeric elements out from an array. We can see the desired output when using typeof. But with Number, it filters zero out.



    Here's the example (tested in Chrome Console):



    [-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(Number)
    
// Which output with zero filtered out:
    
[-1, 1, 2, 3, 4]  // 0 is filtered


    If we use typeof, it doesn't filter zero, which was expected.



    // code
    
[-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(n => typeof n === 'number')
    
// output
    
[-1, 0, 1, 2, 3, 4, 0]


    My question:




    1. What is the difference between the 'Number' and 'typeof' approaches?


    2. Number filters zero, but 'Number' itself literally contains zero, and this confuses me.







    javascript numbers typeof







    share|improve this question









    New contributor




    imckl is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
    Check out our Code of Conduct.























      12












      12








      12


      2





      I'm trying to filter all non-numeric elements out from an array. We can see the desired output when using typeof. But with Number, it filters zero out.



      Here's the example (tested in Chrome Console):



      [-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(Number)
      
// Which output with zero filtered out:
      
[-1, 1, 2, 3, 4]  // 0 is filtered


      If we use typeof, it doesn't filter zero, which was expected.



      // code
      
[-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(n => typeof n === 'number')
      
// output
      
[-1, 0, 1, 2, 3, 4, 0]


      My question:




      1. What is the difference between the 'Number' and 'typeof' approaches?


      2. Number filters zero, but 'Number' itself literally contains zero, and this confuses me.







      javascript numbers typeof







      share|improve this question









      New contributor




      imckl is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
      Check out our Code of Conduct.











      I'm trying to filter all non-numeric elements out from an array. We can see the desired output when using typeof. But with Number, it filters zero out.



      Here's the example (tested in Chrome Console):



      [-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(Number)
      
// Which output with zero filtered out:
      
[-1, 1, 2, 3, 4]  // 0 is filtered


      If we use typeof, it doesn't filter zero, which was expected.



      // code
      
[-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(n => typeof n === 'number')
      
// output
      
[-1, 0, 1, 2, 3, 4, 0]


      My question:




      1. What is the difference between the 'Number' and 'typeof' approaches?


      2. Number filters zero, but 'Number' itself literally contains zero, and this confuses me.







      javascript numbers typeof




      javascript numbers typeof






      share|improve this question









      New contributor




      imckl is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
      Check out our Code of Conduct.











      share|improve this question









      New contributor




      imckl is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
      Check out our Code of Conduct.









      share|improve this question




      share|improve this question








      edited 27 mins ago









      Boann

      36.7k1287121




      36.7k1287121






      New contributor




      imckl is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
      Check out our Code of Conduct.









      asked 5 hours ago









      imckl

      634




      634




      New contributor




      imckl is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
      Check out our Code of Conduct.





      New contributor





      imckl is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
      Check out our Code of Conduct.






      imckl is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
      Check out our Code of Conduct.
























          5 Answers
          5






          active

          oldest

          votes


















          11














          Because 0 is one of the many falsy values in javascript



          All these conditions will be sent to else blocks:



          if (false)
          
if (null)
          
if (undefined)
          
if (0)
          
if (NaN)
          
if ('')
          
if ("")
          
if (``)


          From the Array.prototype.filter() documentation:




          filter() calls a provided callback function once for each element in an array, and constructs a new array of all the values for which callback returns a value that coerces to true




          In your case the callback function is the Number. So your code is equivalent to:



          [-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(a => Number(a))





          share|improve this answer































            2














            Zero is a falsey value. The typeof is always returning a boolean value. When the number 0 is returned, it is returning to the test, and therefore coming back as false, so the number zero is filtered out.






            share|improve this answer





























              2














              To prevent a falsy zero from filtering, you could use another callback for getting only numerical values: Number.isFinite






              console.log([-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(Number.isFinite))








              share|improve this answer





























                1














                When you're using Number in filter, Actually it is passing each item of Array to Number constructor and in case of string or 0 Number will return NaN or 0 and both of them are false so filter is filtering out both of them



                whereas when you're using typeof then 0 has "number" type so it is returning true and filter method doesn't filtering it out






                share|improve this answer





























                  1














                  It's because 0 is a falsy value which returns false



                  Documentation



                  https://developer.mozilla.org/en-US/docs/Glossary/Falsy






                  share|improve this answer























                    Your Answer






                    StackExchange.ifUsing("editor", function () {
                    StackExchange.using("externalEditor", function () {
                    StackExchange.using("snippets", function () {
                    StackExchange.snippets.init();
                    });
                    });
                    }, "code-snippets");

                    StackExchange.ready(function() {
                    var channelOptions = {
                    tags: "".split(" "),
                    id: "1"
                    };
                    initTagRenderer("".split(" "), "".split(" "), channelOptions);

                    StackExchange.using("externalEditor", function() {
                    // Have to fire editor after snippets, if snippets enabled
                    if (StackExchange.settings.snippets.snippetsEnabled) {
                    StackExchange.using("snippets", function() {
                    createEditor();
                    });
                    }
                    else {
                    createEditor();
                    }
                    });

                    function createEditor() {
                    StackExchange.prepareEditor({
                    heartbeatType: 'answer',
                    autoActivateHeartbeat: false,
                    convertImagesToLinks: true,
                    noModals: true,
                    showLowRepImageUploadWarning: true,
                    reputationToPostImages: 10,
                    bindNavPrevention: true,
                    postfix: "",
                    imageUploader: {
                    brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
                    contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
                    allowUrls: true
                    },
                    onDemand: true,
                    discardSelector: ".discard-answer"
                    ,immediatelyShowMarkdownHelp:true
                    });


                    }
                    });






                    imckl is a new contributor. Be nice, and check out our Code of Conduct.










                    draft saved

                    draft discarded


















                    StackExchange.ready(
                    function () {
                    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53920037%2fwhy-does-array-filternumber-filter-zero-out-in-javascript%23new-answer', 'question_page');
                    }
                    );

                    Post as a guest















                    Required, but never shown

























                    5 Answers
                    5






                    active

                    oldest

                    votes








                    5 Answers
                    5






                    active

                    oldest

                    votes









                    active

                    oldest

                    votes






                    active

                    oldest

                    votes









                    11














                    Because 0 is one of the many falsy values in javascript



                    All these conditions will be sent to else blocks:



                    if (false)
                    
if (null)
                    
if (undefined)
                    
if (0)
                    
if (NaN)
                    
if ('')
                    
if ("")
                    
if (``)


                    From the Array.prototype.filter() documentation:




                    filter() calls a provided callback function once for each element in an array, and constructs a new array of all the values for which callback returns a value that coerces to true




                    In your case the callback function is the Number. So your code is equivalent to:



                    [-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(a => Number(a))





                    share|improve this answer




























                      11














                      Because 0 is one of the many falsy values in javascript



                      All these conditions will be sent to else blocks:



                      if (false)
                      
if (null)
                      
if (undefined)
                      
if (0)
                      
if (NaN)
                      
if ('')
                      
if ("")
                      
if (``)


                      From the Array.prototype.filter() documentation:




                      filter() calls a provided callback function once for each element in an array, and constructs a new array of all the values for which callback returns a value that coerces to true




                      In your case the callback function is the Number. So your code is equivalent to:



                      [-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(a => Number(a))





                      share|improve this answer


























                        11












                        11








                        11






                        Because 0 is one of the many falsy values in javascript



                        All these conditions will be sent to else blocks:



                        if (false)
                        
if (null)
                        
if (undefined)
                        
if (0)
                        
if (NaN)
                        
if ('')
                        
if ("")
                        
if (``)


                        From the Array.prototype.filter() documentation:




                        filter() calls a provided callback function once for each element in an array, and constructs a new array of all the values for which callback returns a value that coerces to true




                        In your case the callback function is the Number. So your code is equivalent to:



                        [-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(a => Number(a))





                        share|improve this answer














                        Because 0 is one of the many falsy values in javascript



                        All these conditions will be sent to else blocks:



                        if (false)
                        
if (null)
                        
if (undefined)
                        
if (0)
                        
if (NaN)
                        
if ('')
                        
if ("")
                        
if (``)


                        From the Array.prototype.filter() documentation:




                        filter() calls a provided callback function once for each element in an array, and constructs a new array of all the values for which callback returns a value that coerces to true




                        In your case the callback function is the Number. So your code is equivalent to:



                        [-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(a => Number(a))






                        share|improve this answer














                        share|improve this answer



                        share|improve this answer








                        edited 5 hours ago

























                        answered 5 hours ago









                        adiga

                        5,69662039




                        5,69662039

























                            2














                            Zero is a falsey value. The typeof is always returning a boolean value. When the number 0 is returned, it is returning to the test, and therefore coming back as false, so the number zero is filtered out.






                            share|improve this answer


























                              2














                              Zero is a falsey value. The typeof is always returning a boolean value. When the number 0 is returned, it is returning to the test, and therefore coming back as false, so the number zero is filtered out.






                              share|improve this answer
























                                2












                                2








                                2






                                Zero is a falsey value. The typeof is always returning a boolean value. When the number 0 is returned, it is returning to the test, and therefore coming back as false, so the number zero is filtered out.






                                share|improve this answer












                                Zero is a falsey value. The typeof is always returning a boolean value. When the number 0 is returned, it is returning to the test, and therefore coming back as false, so the number zero is filtered out.







                                share|improve this answer












                                share|improve this answer



                                share|improve this answer










                                answered 5 hours ago









                                bronkula

                                387




                                387























                                    2














                                    To prevent a falsy zero from filtering, you could use another callback for getting only numerical values: Number.isFinite






                                    console.log([-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(Number.isFinite))








                                    share|improve this answer


























                                      2














                                      To prevent a falsy zero from filtering, you could use another callback for getting only numerical values: Number.isFinite






                                      console.log([-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(Number.isFinite))








                                      share|improve this answer
























                                        2












                                        2








                                        2






                                        To prevent a falsy zero from filtering, you could use another callback for getting only numerical values: Number.isFinite






                                        console.log([-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(Number.isFinite))








                                        share|improve this answer












                                        To prevent a falsy zero from filtering, you could use another callback for getting only numerical values: Number.isFinite






                                        console.log([-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(Number.isFinite))








                                        console.log([-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(Number.isFinite))





                                        console.log([-1, 0, 1, 2, 3, 4, Number(0), '', 'test'].filter(Number.isFinite))






                                        share|improve this answer












                                        share|improve this answer



                                        share|improve this answer










                                        answered 3 hours ago









                                        Nina Scholz

                                        174k1388152




                                        174k1388152























                                            1














                                            When you're using Number in filter, Actually it is passing each item of Array to Number constructor and in case of string or 0 Number will return NaN or 0 and both of them are false so filter is filtering out both of them



                                            whereas when you're using typeof then 0 has "number" type so it is returning true and filter method doesn't filtering it out






                                            share|improve this answer


























                                              1














                                              When you're using Number in filter, Actually it is passing each item of Array to Number constructor and in case of string or 0 Number will return NaN or 0 and both of them are false so filter is filtering out both of them



                                              whereas when you're using typeof then 0 has "number" type so it is returning true and filter method doesn't filtering it out






                                              share|improve this answer
























                                                1












                                                1








                                                1






                                                When you're using Number in filter, Actually it is passing each item of Array to Number constructor and in case of string or 0 Number will return NaN or 0 and both of them are false so filter is filtering out both of them



                                                whereas when you're using typeof then 0 has "number" type so it is returning true and filter method doesn't filtering it out






                                                share|improve this answer












                                                When you're using Number in filter, Actually it is passing each item of Array to Number constructor and in case of string or 0 Number will return NaN or 0 and both of them are false so filter is filtering out both of them



                                                whereas when you're using typeof then 0 has "number" type so it is returning true and filter method doesn't filtering it out







                                                share|improve this answer












                                                share|improve this answer



                                                share|improve this answer










                                                answered 5 hours ago









                                                Abhay Sehgal

                                                16318




                                                16318























                                                    1














                                                    It's because 0 is a falsy value which returns false



                                                    Documentation



                                                    https://developer.mozilla.org/en-US/docs/Glossary/Falsy






                                                    share|improve this answer




























                                                      1














                                                      It's because 0 is a falsy value which returns false



                                                      Documentation



                                                      https://developer.mozilla.org/en-US/docs/Glossary/Falsy






                                                      share|improve this answer


























                                                        1












                                                        1








                                                        1






                                                        It's because 0 is a falsy value which returns false



                                                        Documentation



                                                        https://developer.mozilla.org/en-US/docs/Glossary/Falsy






                                                        share|improve this answer














                                                        It's because 0 is a falsy value which returns false



                                                        Documentation



                                                        https://developer.mozilla.org/en-US/docs/Glossary/Falsy







                                                        share|improve this answer














                                                        share|improve this answer



                                                        share|improve this answer








                                                        edited 5 hours ago

























                                                        answered 5 hours ago









                                                        AnonymousSB

                                                        2,149220




                                                        2,149220






















                                                            imckl is a new contributor. Be nice, and check out our Code of Conduct.










                                                            draft saved

                                                            draft discarded


















                                                            imckl is a new contributor. Be nice, and check out our Code of Conduct.













                                                            imckl is a new contributor. Be nice, and check out our Code of Conduct.












                                                            imckl is a new contributor. Be nice, and check out our Code of Conduct.
















                                                            Thanks for contributing an answer to Stack Overflow!


                                                            • Please be sure to answer the question. Provide details and share your research!

                                                            But avoid …



                                                            • Asking for help, clarification, or responding to other answers.

                                                            • Making statements based on opinion; back them up with references or personal experience.


                                                            To learn more, see our tips on writing great answers.





                                                            Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


                                                            Please pay close attention to the following guidance:


                                                            • Please be sure to answer the question. Provide details and share your research!

                                                            But avoid …



                                                            • Asking for help, clarification, or responding to other answers.

                                                            • Making statements based on opinion; back them up with references or personal experience.


                                                            To learn more, see our tips on writing great answers.




                                                            draft saved


                                                            draft discarded














                                                            StackExchange.ready(
                                                            function () {
                                                            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53920037%2fwhy-does-array-filternumber-filter-zero-out-in-javascript%23new-answer', 'question_page');
                                                            }
                                                            );

                                                            Post as a guest















                                                            Required, but never shown





















































                                                            Required, but never shown














                                                            Required, but never shown












                                                            Required, but never shown







                                                            Required, but never shown

































                                                            Required, but never shown














                                                            Required, but never shown












                                                            Required, but never shown







                                                            Required, but never shown







                                                            -

                                                            Popular posts from this blog

                                                            404 Error Contact Form 7 ajax form submitting

                                                            Image
                                                            0 The contact form does not work, and affects loading after one try. The chrome console shows the error message: POST http://example.com/wp-json/contact-form-7/v1/contact-forms/50/feedback 404 (Not Found) send @ jquery.js?ver=1.12.4:4 ajax @ jquery.js?ver=1.12.4:4 wpcf7.submit @ scripts.js?ver=5.0.3:346 (anonymous) @ scripts.js?ver=5.0.3:53 dispatch @ jquery.js?ver=1.12.4:3 r.handle @ jquery.js?ver=1.12.4:3 How to solve this issue? thanks in advance javascript wordpress contact-form-7 share | improve this question edited Jul 17 '18 at 5:39 Kiran Shahi 4,745 3 16 43 ...
                                                            Read more

                                                            How to know if a Active Directory user can login interactively

                                                            Image
                                                            1 I would like to know if and how is it possible to know if a AD user can login interactively (on a server) in a domain. I need to know if I can find it out using a LDAP search. Thanks. windows active-directory login user-permissions user-profile share | improve this question edited 1 hour ago yagmoth555 ♦ 11.6k 3 17 42 asked 1 hour ago Luigi Luigi 6 1 New contributor ...
                                                            Read more

                                                            Refactoring coordinates for Minecraft Pi buildings written in Python

                                                            Image
                                                            0 $begingroup$ I'm fairly new to coding and I wrote this script in Python for a house with a roof in Minecraft Pi. I've found different ways to write the coordinates to make the code base shorter, but I'm wondering if it is possible for me to refactor it any further so I don't have to list each coordinate line by line. import mcpi.minecraft as minecraft import mcpi.block as block mc = minecraft.Minecraft.create() p = mc.player.getTilePos() mc.setBlocks(p.x+1, p.y, p.z+1, #Main structure starting coordinates (DO NOT ALTER) p.x+19, p.y+4, p.z+6, #Structure size/coordinates (Alters cube size) block.STONE_BRICK) mc.setBlocks(p.x+2, p.y+1, p.z+2, #Hollowing out main structure interior p.x+18, p.y+3, p.z+5, block.AIR) mc.setBlocks(p.x, p.y...
                                                            Read more