Some hints to improve writing of JavaScript code [closed] - javascript

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 11 years ago.
The basic idea for writing good code is that the code must be readable, well-commented and documented.
Other basic facts for writing good code regarding all the program languages are structuring the code in directories and files and indentation of course.
In the case of javascript the things could be more complicated,
because the language allows you to use different style to accomplish similar task.
For example there are three different ways to define a JavaScript class.
Said that, which are the best resource (books/sites) or suggestion for writing good code (library) in javascript?

I'd highly recommend reading JavaScript: The Good Parts by Douglas Crockford to get you started on writing quality JavaScript code.

If you're working for a company, is there a standards manual, or something jotted up saying "this is how we want things to be coded"? Yes, it's kinda Dictatorial, but it helps keep things "neat". ---Now, if you do not have one at your company, be proactive, talk to a few higher ups if they think it'd be useful, tactfully get them to delegate it to yourself and then make it. Get some brownie points and a good thing for your resume ---
There's ton's of books on the subject, blogs, pod casts, and probably a radio station somewhere.... that all talk about this subject.
But the #1 thing you will get from people is: Do not put many operations on the same line!
How many times do you look at a script and see a kerfuffle of statements/commands/initiators/setters/getters on one line. Or 4 nested ternary statements.
Sure, it "looks" cool if you're 15, but it is counter productive, not intuitive and not helpful. (yes this is a sour point). Code/Script is supposed to be maintainable. The biggest cost to some companies is maintenance on a product. When you go back to something years/months/days/hours after something is written, you want to be able to understand it without having to tape your eye lids open.
Here's a couple good articles I've read about this. They're not the most up-to-date but the information in them is still strong.
http://amix.dk/blog/post/19496
http://www.codinghorror.com/blog/2008/08/secrets-of-the-javascript-ninjas.html (yes from SO's very own Jeff)
http://www.bobbyvandersluis.com/articles/javascript_good_practices/index.html

Javascript - The Definitive Guide by David Flanagan (O'Reilly)
Pro Javascript Techniques by John Resig (APress)
http://jquery.com/
http://www.crockford.com/
http://developer.yahoo.com/yui/
This list will probably get fairly long, but don't forget you can study most of the code that is out there & you will soon learn what is good and bad - that's one big, great resource.

At the first place i would suggest you to get more familiar with JS object model
I would suggest you to take Douglas Crockford's article on prototypal inheritance:
http://javascript.crockford.com/prototypal.html
and make comparison with classical inheritance model
http://javascript.crockford.com/inheritance.html
More systematic approach of pros and cons of JavaScript can be found in his book
JavaScript: The Good Parts
http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742
If you search for more broader architectural approach
JQuery, ExtJs (a.k.a. Sencha), MooTools are great java script libraries/frameworks to start looking at their design principles.

I would start with JSLint

I would recommend coffee script as a good tool to help write good javascript. It is very readable, and includes some very clever improvements to vanilla javascript, including a very well thought out class declaration system (not trivial in javascript, which is prototype based rather than class based in it's language definition).
For comments, I would recommend JSDoc, which is a javascript version of JavaDoc. I find it to be very easy to maintain comments in the code, and the output is in a standard format that many editors/tools are able to utalise - so not only for people to read. Google have also provided a good set of guidelines of how best to write comments using JSDoc in a standardised manner.

Related

Functional javascript? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
I'd like to use a "javascript derived language" in order to learn and use some of the usual web technologies today like node.js, jquery, etc.
After toying for a while with functional concepts and languages, mostly F#, I'm looking if there's any similar thing in the Javascript world. So far what I've found and considered is:
Javascript the functional way: use javascript's functional parts as extensively as I can, making use of Underscore or other functional libraries. The pros to this approach would be to learn the "mother language". The cons for me are that I really don't like its syntax and doesn't feel very natural to program "functional first" in Javascript.
CoffeeScript + Underscore: I've seen some examples using CoffeScript + Underscore which seem appealing. For example: http://autotelicum.github.com/Smooth-CoffeeScript/SmoothCoffeeScript.html#toc-Chapter-7
The pros to this would be that CoffeScript is spreading wildly and seems the defacto standard of languages designed for its use with a javascript VM. It syntax feels more natural to me and I could program some things the functional way in an easier manner.
The cons would be getting far away from javascript itself (which really isn't too much of a problem to me) and to be in middle ground of non truly functional.
Livescript: Derived from Coco (which itself was derived from CoffeScript), it has the more appealing syntax to me (it even has my beloved pipeline '|>' operator from F#). The pros are that it is the most functional like approach. The cons would be that it isn't very spread (I made a search in SO and there's really NOTHING regarding it) and all that implies (not much community, support, tutorials, etc).
After thinking for a while on all this, I have no real conclusiĆ³n so it'd be great if people used to working with javascript, CoffeeScript, etc could guide me on the real importance of this concerns.
Just in case... I haven't really considered using Pit (and so continue using F#) because although it compiles to javascript, I think it doesn't integrate with any javascript library like the above and doesn't follow the same workflow or integrate with the javascript ecosystem as well as those options listed.
Thanks a lot!
I'm probably a bit biased (I am the creator of LiveScript), but you should try LiveScript! I'm currently working on a standard library for it that will integrate better than underscore. As you say, there aren't that many people using it yet, but a community has to start somewhere! As you've pointed out, it seems like the best option all other things being equal - so take a dive and try it!
You basically have two options:
Use a JS-derived language like CoffeeScript
Use a functional language to JS compiler
For option 1, well, it's probably your best option for interoperability with other JS code. It's also your best option if you actually want to work with other JS developers who may not be familiar with <insert functional language>.
If you aren't actually very familiar with JS, I would suggest option 1. It may be tricky to understand how things work especially if you run into bugs in the language/tool of your choice if you don't understand the JS underpinnings.
Option 2 can be more interesting to use as you would probably get the benefits of your favorite language into JS. In addition to the Pit project you mention, there are some attempts at making Haskell compile into JS which could also be an option.
Option 2's downsides are probably the fact the projects aren't (afaik) very advanced to this day yet and that it may compile into not very efficient JS code.
Lastly, there was some Haskell-style language which was based on JS, similar to CoffeeScript, but I seem to have forgotten its name. It might be worth a shot, if someone can figure out what it was called :D
And what about just a library of ""FUNCTIONAL"" functions , + coffeescript + underscore ;) !
http://osteele.com/sources/javascript/functional/

What is the successful path to writing hard-core javascript applications? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 11 years ago.
I've always been dabbling in javascript, but never really got hugely into writing a lot of javascript until last year or so. One thing I noticed is that my javascript started to grow so complex, that parts of it were more complex than the server's application code (minus all the framework code of course, such as Spring or Hibernate).
This caused me to realize that if you want to write a complex javascript application, in the same way you've been writing complex web applications on the server, you have to start thinking about best practices, architecture, how you structure your files, how you test your code, what abstractions do you use to create smaller, more reusable components, what is the best way to pass parameters and send messages, should i pass parameters or object literals, and just best practices all around. None of this provided or encouraged by Javascript itself, and everyone seems to have its own way of going about everything.
And of course, because Javascript offers such very poor api out of the box, I often spend a countless amount of time researching what the best tools for the job are. Facilities like importing files and dependencies, or even a basic collection library, are things NOT handled by the language. Let's not forget that IDE support, even in something like Idea 10.5, is actually pretty bad and nowhere near as rich as say Java due to its dynamic nature and the lack of these hard-bindings for packages and imports.
Outside of jquery, which I really like and feel comfortable with, I still haven't made any decisions as to the "right" way to do things either. This is odd to me.
Everyone seems to have their own coding idioms too - they either write in a pure functional style, or they try and create a whole classical programming model and then use that. People's coding standards and idioms vary from library to library and person to person. All of this makes knowing what the "right" thing to do an incredible task.
Even worse, there doesn't seem to be books on this sort of thing. It's like nobody has bothered to tackle it - which is totally contrary to what we have in the Java space, or many other spaces for that matter.
What is the right/successful path to having a refined way to successfully write nice-looking and robust javascript for complex web applications?
I feel like my knowledge of Javascript expanded and became more complete after reading Douglas Crockford's Javascript: The Good Parts. He really clarifies the most difficult and important parts of the language.
Reading it made clear the different types of inheritance: neoclassical, functional, prototypal. And the different ways to invoke a function: constructor invocation, apply invocation, function invocation, and method invocation.
I would start there.

Want to know the base level (not the basics) architecture of the JavaScript [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 12 years ago.
I am having a good knowledge of JavaScript, I have a passion to know more and in-depth about it. So I am start searching for the base or structural level and also various concept like event delegate, event bubbling etc. is there is any resource for it?
I can think of two.
Douglas Crockford's javascript page is full of awesome knowledge pearls about the language (both basics and advanced stuff).
The Secrets of the Javascript Ninja book is an advanced resource. It's written by John Resig, the guy bejind jquery. It's still not out, but if you pre-buy it you have access to the beta editions (a new one popped out 2 weeks ago)
One of my favorite resources is Douglas Crockford's series of videos on Javascript: http://javascript.crockford.com/
He gives you a whole history lesson wrapped up into practical usage that explains the how and why the system works. Beyond that, check out the resources that John Resig has available on his blog (the creator of JQuery, a very popular Javascript library): http://ejohn.org/blog/
This is a fun one after you have gone through the Crockford videos: http://ejohn.org/apps/learn/
If you can understand what both Crockford and Resig discuss, you'll be able to handle just about any problem JS can throw at you.
I think quirksmode.org has a very good introduction to events:
Introducation
Event Order
Early event handlers
Traditional event registration model
Advanced event registration models
Event properties
Event compatibility tables
Then of course there is MDC JavaScript Guide and various books such as
High Performance JavaScript
JavaScript Patterns
To really get stuck into the architecture of javascript you should have a good thorough read of the Specification.
The specification will let you have a better understanding of the internals of JavaScript and gives an insight into how things work under the hood. You may also get a feeling for what non-standard parts of javascript you've been accidentally using.
Another route to getting a better understanding would be to read well known and (hopefully) well structured open source libraries.
Reading such libraries is a great way to learn javascript design patterns and how to utilise various parts to the maximum effect.
A third, (and significantly more advance) option would be to read the open source implementation of chrome.
This would give you an understanding of the low level implentation of javascript. You know exactly what the interpreter is doing with your code under the hood.
If your interested in the DOM more then JavaScript itself you can always read the HTML5 spec

HTML, XHTML, and CSS... what are some good resources? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
What's a good book, or a good way to learn HTML, XHTML, and CSS? I recently graduated from school and I only know Java, and C++.
I would like to learn some web development so I am looking for some good books and resources.
If you ask me, whatever introductory level book you can find at your public library on html or css or "web programming" is a great place to start as far as books go. Typically, those kinds of books are a little bit "stale" as far as you're likely to find something that's not the latest greatest version of HTML, but for the most part very few parts of the HTML spec get deprecated or removed from version to version, so anything you'd learn from slightly obsolete books will generally still exist, but
There's a ton of great stuff online too about every specific topic you could want, for the most part, you could get by without buying any books
Here's a link (http://jwinblad.com/webprogramming/webdesign.php) to some of my personal bookmarks on web-development that I like to keep handy like the specifications for CSS and HTML that enumerate every possible tag or CSS property and give you a brief description of what each one means and is used for.
Of course, actually trying out different tags and CSS experimentally is sometimes much more helpful in learning. If there's a website that does something cool, you can often times learn how to they do their cool feature by viewing the source-code of the page or its style sheet using the tools provided in your web-browser. Create a hello-world demo-page and then work from there on adding extra tags and a style sheet and so on. If there's something specific you want to do, you can search for tips on how to do that particular thing
If you already know Java and C++, it should not be difficult to learn HTML/XHTML and CSS. But if you're looking at learning this with the hopes of it being a career direction or paying job, you will probably want to delve into more than just HTML, nobody seems to be looking for people to write webpages that look like they came out of 1998 or 2001, you can get nicer looking stuff that that with almost no HTML knowledge using WYSIWYG tools...once you get the basics of HTML understood and know where to look up tags and CSS descriptors, you may want to branch out either into a client-side scripting language like Javascript or a server-side programming language or framework (PHP, Ruby on Rails, etc) or trendy web-technology like Flash. It kind of depends what your goals are in learning web-programming.
If you are interested in online resources, The SitePoint Reference seems good. It covers HTML, CSS, and JavaScript. The information seems clear, and there is the capability to add user notes as well.
If you prefer printed material, I started out with HTML for Dummies - despite the common opinion on For Dummies books, they are actually useful for picking up a new subject. I keep handy the HTML/XHTML Definitive Guide and the CSS Definitive Guide - both from O'Reilly. Those two are good for references.
For JavaScript, I recommend Simply JavaScript from SitePoint, and Dom Scripting from Friends of Ed.
Based on personal experience, coming from no programming experience at the time:
View source is a great tool. Read other people's code. [EDIT: To access view source, right click on the page in your browser and choose view source from the context menu. Alternatively, you can look in the browsers "Page" menu, although the menu name and placement varies by browser and OS.]
I used a tutorial site on geocities (may it rest in peace) but there are many other good sites. Use a search engine.
Books - Jeff Zeldman's book "Designing with web standards" was one of my first reads a number of years back. Books do tend to get outdated, but that one is a keeper. I think that there is a new edition in the works. Also, Visual Quickstart books are a personal favorite, but hey teach particular things and not the whole languages. There is a Visual QuickStart book with fairly recent code and a great reference for your desk. ( I forgot the title...)
good luck! Bing is your friend!
If you know programming languages like Java, then I'd recommend checking out the HTML4 spec on the W3C site.
It is as close as you'll come to the official docs.
I'd also recommend learning the differences between HTML and XHTML, why XHTML has no benefits to today's web (IE, content types, error handling too unforgiving) and also I'd look into HTML5, just to keep current.
Here is a quick overview of differences between HTML and XHTML that I found whilst surfing Jessica's website.
IMHO, the best way to learn it is by doing it, make a plan for a website, and have a go at making it happen (repeat as required), by the time you put html, css, javascript, and eventually a server side framework together, it can be a bit of a dark art, and there is much learning that can only happen when you are actually doing it (and feeling the pain of IE 6).
As mentioned by others, Sitepoint, Smashingmagazine, W3Schools (to name a few) are all handy references.
Would also suggest learning jquery as you learn javascript, some good starting tutorials here http://docs.jquery.com/Tutorials.
Also install firebug in firefox so you can start digging under the hood of sites you like.
With regard to books, from personal experience, I have a stack of outdated technology specific books that I have not touched for quite a few years. The ones that focus on why rather than how get much higher rotation.
If you have learnt java and c++, the mechanics of the technologies shouldn't be too hard to pick up, but many programmers tend to suck at things related to UI, so if you were to get a book, I would recommend "Don't Make Me Think" or other books related to usability and interface design.
HTH. Good Luck.
I'd recommend Professional CSS: Cascading Style Sheets for Web Design. There apparently is a second edition now, but my first edition has:
Chapter 2: Best Practices for XHTML and CSS
The book (first edition) is basically comprised of case studies of css and xhtml implementations at ESPN, PGA Championship, and the University of Florida, with many great tips and explanations of why things are done a certain way.
I'm working through Head First HTML with CSS & XHTML. I have found it to be quite useful in staring me off with these technologies.
If you're looking for reference information, W3 Schools is a great place to start. Smashing Magazine is great for pretty much everything to do with web development. I'd also recommend A List Apart, which often has great articles about some of the more difficult CSS concepts. And last, but certainly not least, I'd check out the articles on 24 ways; while they only have 24 updates every year (in December), they are written by some of the best people in the industry.
Ans since you're interested in web development, you'll probably end up wanting to learn some Javascript as well. ppk's site quirksmode.org is a great place for that.
Well, I hope this can be some help to you, and wish you best of luck. Also, of course, you can always ask any question that you have here at Stack Overflow.

Are jQuery and its peers helping or hurting JavaScript Knowledge? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
I noticed most questions related to client-side script on SO are jQuery related and that got me thinking. I'm wondering what the ease of these libraries is doing to actual KNOWLEDGE of JavaScript and the DOM.
So much is done for you that my fear is there is a growing number of web developers that actually know very little about JavaScript besides how to include the jQuery library and use the plug-ins they download. It's the "fast food" approach to software development and, based on nothing more than anecdotal evidence, I think a lot of web "developers" would be in the dark when it comes to client script if they were suddenly unable to use the jQuery library.
My question: are these libraries helping or hurting REAL knowledge of client-side scripting?
In my opinion jQuery is to DOM as the .NET Framework is to the Win32 API, or GTK+ is to X11 programming. It's another layer on top of the "raw" API. It makes things a lot easier to work with, at the "cost" of abstracting the lower level details. Usually this is OK, but sometimes these details are important. It can help at times to be familiar with the underlying API (I think moreso in the jQuery/DOM case than .NET/Win32), but I wouldn't worry overmuch if someone has to hit a reference site or two before coding a pure DOM solution.
It's also important to recognize the difference between "JavaScript" and "the DOM". The DOM is not part of the JavaScript language; it is merely an API exposed by to the JavaScript engines in the major browsers. So while using jQuery might hinder one's knowledge of the DOM, it won't hurt their knowledge of the JavaScript language itself.
This is common question in programming.
Libraries and high levels of abstractions, in general, make things that were once difficult, much simpler. This tends to make the number of people who understand low-level internals smaller, but also increases the overall productivity of the industry.
jQuery have hurt my knowledge of DOM: I forget this **** DOM as a nightmare.
jQuery will never hurt my knowledge of JavaScript. You can't forget JavaScript after Crockford's texts
I started by learning Javascript as a child - HTML + Javascript was the easiest thing to deploy without having to actually know much about how computers worked. Since then, I feel that I know more about Javascript than I ever would have to.
However, there are very few projects now for which I use Javascript without jQuery. In fact, before I knew about jQuery, I made my own libraries. They weren't great, but they worked, and saved me loads of time and repeated code.
I guess my point is that the Javascript pros would have produced great libraries for themselves, no matter how many n00bs ended up grabbing onto them. Even if we're hurting beginners' knowledge of Javascript (an assertion which I'm not even going to make), jQuery is still definitely a good thing. What it does to beginners is a question of the learning process we offer beginners, rather than the tool itself.
I think that jQuery and its peers are probably greatly increasing general knowledge of Javascript. When I discovered jQuery I went from disliking Javascript and using it as little as possible to thinking it was a wonderful and beautiful language. Indeed, it might now be my favourite language in which to program, and I've learned an awful lot by reading the source code of the jQuery library. I can't believe that my experience is in any way unusual.
Why do you care about the "real" knowledge? The end result is all that matters.
If a developer can make a website that loads really fast with a great interface and layout, then he or she is a successful developer. How (s)he did it is irrelevant.

Categories

Resources