Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • World
  • Users
  • Groups
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
Code Project
  1. Home
  2. The Lounge
  3. Javascript brace style - THAT discussion probably again

Javascript brace style - THAT discussion probably again

Scheduled Pinned Locked Moved The Lounge
csharpquestionjavascriptpythonhtml
31 Posts 21 Posters 25 Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • S Slacker007

    Marc Clifton wrote:

    VS formatted it back to option 1.

    you can change this in VS options Options --> text editor --> javascript/typescript

    R Offline
    R Offline
    R Giskard Reventlov
    wrote on last edited by
    #9

    :thumbsup:

    1 Reply Last reply
    0
    • M Marc Clifton

      So, I force myself to write Javascript with this brace style, since it seems that that's what is the "correct" style (example):

      function ajaxError(data) {
      alertBad(data);
      }

      But then I see this [HTML5 WebSockets](https://www.tutorialspoint.com/html5/html5\_websocket.htm) and their example uses the style I'm used to in C#. So which is the "approved / standard / whatever" style? What style do you use: 1: Javascript style as per example? 2: Braces on separate lines style?

      Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

      Mike HankeyM Offline
      Mike HankeyM Offline
      Mike Hankey
      wrote on last edited by
      #10

      I actually use both. Since they both have accepted styles I've adapted and just go with the flow.

      Someone's therapist knows all about you!

      1 Reply Last reply
      0
      • R R Giskard Reventlov

        Same as you; mostly because I use the format document/selection menu option in Visual Studio to tidy up code and it's left at the defaults.

        T Offline
        T Offline
        TNCaver
        wrote on last edited by
        #11

        I used to use the format selection option all the time, until it mysteriously disappeared from the menu. Can't figure out how to get it back.

        If you think 'goto' is evil, try writing an Assembly program without JMP.

        1 Reply Last reply
        0
        • M Marc Clifton

          So, I force myself to write Javascript with this brace style, since it seems that that's what is the "correct" style (example):

          function ajaxError(data) {
          alertBad(data);
          }

          But then I see this [HTML5 WebSockets](https://www.tutorialspoint.com/html5/html5\_websocket.htm) and their example uses the style I'm used to in C#. So which is the "approved / standard / whatever" style? What style do you use: 1: Javascript style as per example? 2: Braces on separate lines style?

          Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

          N Offline
          N Offline
          Nemanja Trifunovic
          wrote on last edited by
          #12

          Be careful! With JavaScript, it is not just a matter of style[^]. Just use the K&R style or you may introduce subtle bugs. Plus, K&R is the only true style :-D

          utf8-cpp

          M G 2 Replies Last reply
          0
          • M Marc Clifton

            So, I force myself to write Javascript with this brace style, since it seems that that's what is the "correct" style (example):

            function ajaxError(data) {
            alertBad(data);
            }

            But then I see this [HTML5 WebSockets](https://www.tutorialspoint.com/html5/html5\_websocket.htm) and their example uses the style I'm used to in C#. So which is the "approved / standard / whatever" style? What style do you use: 1: Javascript style as per example? 2: Braces on separate lines style?

            Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

            J Offline
            J Offline
            Jeremy Falcon
            wrote on last edited by
            #13

            I like you, refused to use 1TBS style braces (it's based on K&R and what JavaScript uses). I came from a C/C++ and PHP world after all. I was a real programmer. Besides, the style sucked. It's evil and ugly. Somewhere ponies will die if I used them. However, there is a valid reason why 1TBS became so popular with JavaScript. That code on the site was simply written by a rookie to JavaScript. Check out section 3 in the following link... Brace styles and JavaScript[^] That one little tidbit is the only valid reason for it and it started it all. In other words, it's only way to return an object literal like that in a function. So the community just adapted this style.

            Jeremy Falcon

            M J 2 Replies Last reply
            0
            • S Slacker007

              Marc Clifton wrote:

              VS formatted it back to option 1.

              you can change this in VS options Options --> text editor --> javascript/typescript

              M Offline
              M Offline
              Marc Clifton
              wrote on last edited by
              #14

              Slacker007 wrote:

              you can change this in VS options

              Woohoo! Saved me a google search. :jig:

              Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

              S 1 Reply Last reply
              0
              • M Marc Clifton

                Slacker007 wrote:

                you can change this in VS options

                Woohoo! Saved me a google search. :jig:

                Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

                S Offline
                S Offline
                Slacker007
                wrote on last edited by
                #15

                :)

                1 Reply Last reply
                0
                • N Nemanja Trifunovic

                  Be careful! With JavaScript, it is not just a matter of style[^]. Just use the K&R style or you may introduce subtle bugs. Plus, K&R is the only true style :-D

                  utf8-cpp

                  M Offline
                  M Offline
                  Marc Clifton
                  wrote on last edited by
                  #16

                  Nemanja Trifunovic wrote:

                  Be careful! With JavaScript

                  Eep! That was quite informative!

                  Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

                  1 Reply Last reply
                  0
                  • J Jeremy Falcon

                    I like you, refused to use 1TBS style braces (it's based on K&R and what JavaScript uses). I came from a C/C++ and PHP world after all. I was a real programmer. Besides, the style sucked. It's evil and ugly. Somewhere ponies will die if I used them. However, there is a valid reason why 1TBS became so popular with JavaScript. That code on the site was simply written by a rookie to JavaScript. Check out section 3 in the following link... Brace styles and JavaScript[^] That one little tidbit is the only valid reason for it and it started it all. In other words, it's only way to return an object literal like that in a function. So the community just adapted this style.

                    Jeremy Falcon

                    M Offline
                    M Offline
                    Marc Clifton
                    wrote on last edited by
                    #17

                    Jeremy Falcon wrote:

                    That one little tidbit is the only valid reason for it and it started it all. In other words, it's only way to return an object literal like that in a function. So the community just adapted this style.

                    Yup - just read about that from Nemanja Trifunovic's post. That was a learning moment for me!

                    Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

                    J 1 Reply Last reply
                    0
                    • M Marc Clifton

                      Jeremy Falcon wrote:

                      That one little tidbit is the only valid reason for it and it started it all. In other words, it's only way to return an object literal like that in a function. So the community just adapted this style.

                      Yup - just read about that from Nemanja Trifunovic's post. That was a learning moment for me!

                      Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

                      J Offline
                      J Offline
                      Jeremy Falcon
                      wrote on last edited by
                      #18

                      Oh snap, he beat me to it. It was a moment for me too man. Had it not been for that one point I'd not be using that style either. The only good news is at least you get used to it... at some point. :laugh:

                      Jeremy Falcon

                      1 Reply Last reply
                      0
                      • M Marc Clifton

                        So, I force myself to write Javascript with this brace style, since it seems that that's what is the "correct" style (example):

                        function ajaxError(data) {
                        alertBad(data);
                        }

                        But then I see this [HTML5 WebSockets](https://www.tutorialspoint.com/html5/html5\_websocket.htm) and their example uses the style I'm used to in C#. So which is the "approved / standard / whatever" style? What style do you use: 1: Javascript style as per example? 2: Braces on separate lines style?

                        Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

                        P Offline
                        P Offline
                        PIEBALDconsult
                        wrote on last edited by
                        #19

                        The only language I know of that gives a crap is tcl. Fortunately I don't have to write it, I only have to parse it.

                        1 Reply Last reply
                        0
                        • J Jeremy Falcon

                          I like you, refused to use 1TBS style braces (it's based on K&R and what JavaScript uses). I came from a C/C++ and PHP world after all. I was a real programmer. Besides, the style sucked. It's evil and ugly. Somewhere ponies will die if I used them. However, there is a valid reason why 1TBS became so popular with JavaScript. That code on the site was simply written by a rookie to JavaScript. Check out section 3 in the following link... Brace styles and JavaScript[^] That one little tidbit is the only valid reason for it and it started it all. In other words, it's only way to return an object literal like that in a function. So the community just adapted this style.

                          Jeremy Falcon

                          J Offline
                          J Offline
                          jsc42
                          wrote on last edited by
                          #20

                          TOOTBS (aka K&R) is only about layout of statements. It gets confused with object literals purely because they use braces but for an entirely different purpose; same as '(' and ')' have multiple uses, as does the ','. That, combined with the lazy end of statement convention, is the only rationale for using TOOTBS. But you can use logical aligned braces even when returning objects either by making them subexpressions (using one of the alternative uses of '(' and ')') or by converting the object to a named object. Viz:

                          return (
                          {
                          p1: 1,
                          p2: 2
                          });
                          // or (my preference)
                          var result =
                          {
                          p1: 1,
                          p2: 2
                          };

                          return result;

                          J 2 Replies Last reply
                          0
                          • J jsc42

                            TOOTBS (aka K&R) is only about layout of statements. It gets confused with object literals purely because they use braces but for an entirely different purpose; same as '(' and ')' have multiple uses, as does the ','. That, combined with the lazy end of statement convention, is the only rationale for using TOOTBS. But you can use logical aligned braces even when returning objects either by making them subexpressions (using one of the alternative uses of '(' and ')') or by converting the object to a named object. Viz:

                            return (
                            {
                            p1: 1,
                            p2: 2
                            });
                            // or (my preference)
                            var result =
                            {
                            p1: 1,
                            p2: 2
                            };

                            return result;

                            J Offline
                            J Offline
                            Jeremy Falcon
                            wrote on last edited by
                            #21

                            Using a variable is a given as a way to dance around it. As far as your first point it solves nothing and doesn't illustrate the point we're making. Try running it in regards to what we're talking about. In fact, here's a fiddle... Edit fiddle - JSFiddle[^]

                            Jeremy Falcon

                            1 Reply Last reply
                            0
                            • J jsc42

                              TOOTBS (aka K&R) is only about layout of statements. It gets confused with object literals purely because they use braces but for an entirely different purpose; same as '(' and ')' have multiple uses, as does the ','. That, combined with the lazy end of statement convention, is the only rationale for using TOOTBS. But you can use logical aligned braces even when returning objects either by making them subexpressions (using one of the alternative uses of '(' and ')') or by converting the object to a named object. Viz:

                              return (
                              {
                              p1: 1,
                              p2: 2
                              });
                              // or (my preference)
                              var result =
                              {
                              p1: 1,
                              p2: 2
                              };

                              return result;

                              J Offline
                              J Offline
                              Jeremy Falcon
                              wrote on last edited by
                              #22

                              Btw, when we say object literal in a return statement, that explicitly implies to not use a variable. Which is the entire point of what we're talking about. What is literal? Webopedia Definition[^]

                              Jeremy Falcon

                              1 Reply Last reply
                              0
                              • M Marc Clifton

                                So, I force myself to write Javascript with this brace style, since it seems that that's what is the "correct" style (example):

                                function ajaxError(data) {
                                alertBad(data);
                                }

                                But then I see this [HTML5 WebSockets](https://www.tutorialspoint.com/html5/html5\_websocket.htm) and their example uses the style I'm used to in C#. So which is the "approved / standard / whatever" style? What style do you use: 1: Javascript style as per example? 2: Braces on separate lines style?

                                Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

                                E Offline
                                E Offline
                                EbenRoux
                                wrote on last edited by
                                #23

                                Perhaps someone has mentioned this but haven't read *all* the responses :) There is actually a bit of a caveat with JS: it terminate some lines automatically (like an invisible semi-colon) Open your browser and go to the dev-tools (typically F12) and enter the following:

                                var f1 = function() {
                                return {
                                value: 'the-value'
                                };
                                }

                                var f2 = function() {
                                return
                                {
                                value: 'the-value'
                                };
                                }

                                Now have it execute

                                f1()

                                and then

                                f2()

                                . You'll quickly see the difference :) It is better to stick with the "standard" with braces on the same line. For my C# code it's is quite different.

                                1 Reply Last reply
                                0
                                • M Marc Clifton

                                  So, I force myself to write Javascript with this brace style, since it seems that that's what is the "correct" style (example):

                                  function ajaxError(data) {
                                  alertBad(data);
                                  }

                                  But then I see this [HTML5 WebSockets](https://www.tutorialspoint.com/html5/html5\_websocket.htm) and their example uses the style I'm used to in C#. So which is the "approved / standard / whatever" style? What style do you use: 1: Javascript style as per example? 2: Braces on separate lines style?

                                  Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

                                  J Offline
                                  J Offline
                                  John Bevan
                                  wrote on last edited by
                                  #24

                                  Generally follow the standards / style guide at your place of work. However, with JavaScript there can be gotchas; due to semicolons being optional, as per this example: javascript - Why does a results vary based on curly brace placement? - Stack Overflow[^] So you have to be cautious that in such cases you use the code that works over the dictated style; and put a comment so no one decides to clean up your formatting not realising that they're introducing a bug. If you're defining a style, I'd say it's best to pick one which avoids this issue, so going with some variant of K&R makes sense for this language, to avoid such pitfalls & any cognitive load related to spotting them. For most other languages (i.e. where placement is solely formatting), I'd typically recommend Allman style for clarity (personal preference); though I may suggest K&R for any projects where the same developers are likely to work with JavaScript; again so they don't have to think about it (i.e. when switching languages). Regarding my personal preference; historically I was a K&R advocate, but later realised that the Allman style allows lining up the open and close brackets, which is more obvious than lining up the code responsible for the bracket. Once you develop the habit of thinking "the line before the open brace is the one defining this block" rather than "the first line of the block defines the block & ends with the opening brace" it pays off. You do use up more screen real estate; but often (at least for developers with large monitors), that's good, since it removes clutter.

                                  1 Reply Last reply
                                  0
                                  • N Nemanja Trifunovic

                                    Be careful! With JavaScript, it is not just a matter of style[^]. Just use the K&R style or you may introduce subtle bugs. Plus, K&R is the only true style :-D

                                    utf8-cpp

                                    G Offline
                                    G Offline
                                    Gary Wheeler
                                    wrote on last edited by
                                    #25

                                    Nemanja Trifunovic wrote:

                                    it is not just a matter of style[^]

                                    That is utterly disgusting. An interpreter that changes programmer intent based upon white space can't be trusted.

                                    Nemanja Trifunovic wrote:

                                    K&R is the only true style

                                    I was a K&R true believer for a long time. I like white space (line breaks) in my code to delineate things. When I started writing in C#, I discovered that Allman style[^] reduced the number of line breaks while retaining the visual separation.

                                    Software Zen: delete this;

                                    D J 2 Replies Last reply
                                    0
                                    • G Gary Wheeler

                                      Nemanja Trifunovic wrote:

                                      it is not just a matter of style[^]

                                      That is utterly disgusting. An interpreter that changes programmer intent based upon white space can't be trusted.

                                      Nemanja Trifunovic wrote:

                                      K&R is the only true style

                                      I was a K&R true believer for a long time. I like white space (line breaks) in my code to delineate things. When I started writing in C#, I discovered that Allman style[^] reduced the number of line breaks while retaining the visual separation.

                                      Software Zen: delete this;

                                      D Offline
                                      D Offline
                                      Dan Neely
                                      wrote on last edited by
                                      #26

                                      Gary Wheeler wrote:

                                      That is utterly disgusting. An interpreter that changes programmer intent based upon white space can't be trusted.

                                      There's a reason why so many of us loathe javascript. X|

                                      Did you ever see history portrayed as an old man with a wise brow and pulseless heart, weighing all things in the balance of reason? Is not rather the genius of history like an eternal, imploring maiden, full of fire, with a burning heart and flaming soul, humanly warm and humanly beautiful? --Zachris Topelius Training a telescope on one’s own belly button will only reveal lint. You like that? You go right on staring at it. I prefer looking at galaxies. -- Sarah Hoyt

                                      G 1 Reply Last reply
                                      0
                                      • D Dan Neely

                                        Gary Wheeler wrote:

                                        That is utterly disgusting. An interpreter that changes programmer intent based upon white space can't be trusted.

                                        There's a reason why so many of us loathe javascript. X|

                                        Did you ever see history portrayed as an old man with a wise brow and pulseless heart, weighing all things in the balance of reason? Is not rather the genius of history like an eternal, imploring maiden, full of fire, with a burning heart and flaming soul, humanly warm and humanly beautiful? --Zachris Topelius Training a telescope on one’s own belly button will only reveal lint. You like that? You go right on staring at it. I prefer looking at galaxies. -- Sarah Hoyt

                                        G Offline
                                        G Offline
                                        Gary Wheeler
                                        wrote on last edited by
                                        #27

                                        It's stuff like this that reminds me to be glad I don't do web programming.

                                        Software Zen: delete this;

                                        1 Reply Last reply
                                        0
                                        • M Marc Clifton

                                          So, I force myself to write Javascript with this brace style, since it seems that that's what is the "correct" style (example):

                                          function ajaxError(data) {
                                          alertBad(data);
                                          }

                                          But then I see this [HTML5 WebSockets](https://www.tutorialspoint.com/html5/html5\_websocket.htm) and their example uses the style I'm used to in C#. So which is the "approved / standard / whatever" style? What style do you use: 1: Javascript style as per example? 2: Braces on separate lines style?

                                          Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

                                          W Offline
                                          W Offline
                                          who_me 0
                                          wrote on last edited by
                                          #28

                                          The obsessive compulsive in me hates the 'brace on same line' style. It feels like you're deliberately starting something on the end of a sentence. Start a statement/block at the start of a line, that's easiest for most of us to read. I think. (If that paragraph was a little harder to read than normal, my point is made). There's a good case for the vertical compression that the K&R style offers, showing more code on screen at the same time makes it easier for the reader to take in more at once. Ideally, he/she should be able to see any function/method onscreen at once. Conversely, if you have nested blocks, I find the Allman style far clearer in determining which brackets match with which. Ideally the editor would just display according to the preferences of the viewer, but as per the js example above, it's probably not always feasible. I don't know if source-comparison tools are smart enough to determine "nothing changed apart from indentation/non-printing characters, so mark nothing as changed".

                                          1 Reply Last reply
                                          0
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          • Login

                                          • Don't have an account? Register

                                          • Login or register to search.
                                          • First post
                                            Last post
                                          0
                                          • Categories
                                          • Recent
                                          • Tags
                                          • Popular
                                          • World
                                          • Users
                                          • Groups