Those brief encounter JavaScript tricks.

Source: Internet
Author: User

The success of JavaScript is fascinating, and writing JavaScript code for Web pages is already the basic skill of all web designers, and this interesting language contains many things that are not well known, even though many years of JavaScript programmers are not completely thoroughly understand. This article is about 7 things you don't know about JavaScript, but very useful tricks.

Shorthand statement

JavaScript can quickly create objects and arrays using shorthand statements, such as the following code:

You can use the following shorthand statements:

Object car is created, but you need to pay special attention to the end of the curly braces must not add ";" otherwise in IE will encounter a lot of trouble.

The traditional way to create an array is:

Using the shorthand statement:

Another place where you can use a shorthand statement is a conditional judgment statement:


Can be briefly as follows:

JSON data format

JSON is the abbreviation for "JavaScript Object Notation", designed by Douglas Crockford, which changes the dilemma of JavaScript in caching complex data formats, as in the example below, if you want to describe a band, you can write:

You can use JSON directly in JavaScript, and even as a return data object for some APIs, the following code calls an API for the well-known bookmark site delicious.com, returns all your bookmarks on that site, and displays it on your own website:

JavaScript native Functions (Math, Array, and String)

JavaScript has a lot of built-in functions that can be used effectively to avoid a lot of unnecessary code, such as finding the maximum from an array, the traditional way is:

Using built-in functions makes it easier to implement:

Another method is to use the Math.max () method:

You can use this method to help probe the browser

This solves a problem with IE, in this way, you can always find the correct value, because the browser does not support that value will return undefined.

You can also use JavaScript's built-in Split () and join () functions to handle the CSS class name of an HTML object, and if the class name of the HTML object is multiple names separated by spaces, you need to pay special attention when appending or deleting a CSS class name for it, if the object has no class name , you can directly assign the new class name to it, and if the class name already exists, there must be a space before the new class name, which is implemented with the traditional JavaScript method:

Using the split and join methods is much more intuitive and elegant:

Event Proxy

Instead of designing a bunch of events in an HTML document, you might as well design an event proxy, for example, if you have links that users don't want to open when they click, but instead execute an event with the HTML code:

Traditional event handling is the traversal of individual links, plus the handling of individual events:

With the event proxy, you can handle it directly without traversing:

anonymous function and Module mode

One problem with JavaScript is that any variable, function, or object, unless defined inside a function, is global, meaning that the other code of the same page can access and rewrite the variable (the ECMA JavaScript 5 has changed the situation-translator), With anonymous functions, you can circumvent this problem.

For example, you have such a piece of code, it is clear that the variable name, age, status will be the global variable

To avoid this problem, you can use an anonymous function:

If this function is not called, it can be more straightforward:

If you want to access an object or function within it, you can:

This is called Module mode or singleton mode (Singleton), this mode is Douglas Crockford respected, and is widely used in the Yahoo User Interface Library YUI.

If you want to invoke the inside method somewhere else, and do not want to use the MyApplication object name before the call, you can return these methods in the anonymous function, even with the abbreviation return:

Code configuration

When someone uses your JavaScript code, it's hard to change some code, but it's difficult because not everyone is easy to read someone else's code, so instead of creating a code configuration object, someone else just needs to change some configuration in that object to make the code change. Here is an article on the JavaScript configuration object, which simply says:

    • Create an object called a configuration in your code
    • It saves all configuration changes, such as CSS ID and class name, button label text, descriptive text, localized language settings
    • Set the object as a global object so that others can directly access and overwrite

You should do this at the last step, here is an article, a reference to the value of 5 things before delivering the code.

Interacting with the background

JavaScript is a front-end language, you need other languages to interact with the background, and return data, using AJAX, you can let JavaScript directly with the background of the interaction, the complex data processing to the background processing.

JavaScript Framework

Writing your own code to fit a variety of browsers is a complete waste of time, and you should choose a JavaScript framework to give these complex things to the framework.

More Resources
    • Douglas Crockford on JavaScript
      JavaScript in-depth video tutorial
    • The Opera WEB Standards Curriculum
      JavaScript detailed
Extended Reading
      • 10 things that are puzzling about JavaScript
      • New API seeks to get JavaScript to manipulate local files
      • Let JavaScript save HTML5 off-line storage
      • Open source projects increasingly favor JavaScript
      • Is Javascript a mistake?
      • Javascript 2 The future dust settles
      • 10 of the most famous JavaScript libraries in Google rankings
      • ECMA launches JavaScript 5

Those brief encounter JavaScript tricks.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.