Javascript skills that match each other)

Source: Internet
Author: User

The success of JavaScript is repeat. Writing JavaScript code for Web pages is already the basic skill of all web designers. This interesting language contains many unfamiliar things, even if Javascript programmers who have been writing JavaScript for many years, not completely thorough. This article describes seven tips that are not familiar with but useful in JavaScript.

Simple statement

Javascript can use simple statements to quickly create objects and arrays, such as the following code:

You can use the following simple statement:

The object car is created here, but note that do not add ";" before ending the curly brackets; "Otherwise, it will be very troublesome for IE.

The traditional method for creating arrays is:

Use the simple statement:

Another simple statement that can be used is the condition judgment statement:


It can be simply as follows:

JSON Data Format

JSON, short for "JavaScript Object Notation", is designed by Douglas crockford. JSON changes the difficulty of Javascript in caching complex data formats. For example, if you want to describe a band, you can write as follows:

You can directly use JSON in Javascript, or even return data objects as some APIs. The following code calls an API of delicious.com, the famous bookmarkdon.com, and returns all your bookmarks on the website, and displayed on your own website:

Javascript local functions (Math, array, and string)

Javascript has many built-in functions, which can be effectively used to avoid a lot of unnecessary Code. For example, to find the maximum value from an array, the traditional method is:

Using built-in functions can be easier to implement:

Another method is to use the math. Max () method:

You can use this method to detect browsers

This solves the problem of IE browser. In this way, you can always find the correct value, because the value not supported by the browser will return undefined.

You can also use the Javascript built-in split () and join () functions to process the CSS class names of HTML objects. If the class names of HTML objects are separated by spaces, when you append or delete a CSS class name for the object, you must note that if the object does not have the class name attribute, you can directly assign the new class name to it, if a class name already exists, there must be a space before the new class name, which is implemented using the traditional JavaScript method as follows:

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

Event proxy

Instead of designing a bunch of events in the HTML document, it is better to directly design an event proxy. For example, if you have some links, the user does not want to open the link after clicking, but executes an event, the HTML code is as follows:

Traditional event processing is to traverse various links and add corresponding event processing:

With event proxy, you can directly process it without traversing:

Anonymous function and module Mode

One problem with JavaScript is that any variable, function, or object, unless defined within a function, is global, this means that other code on the same web page can access and rewrite this variable (ECMA's JavaScript 5 has changed this situation-the translator). Using anonymous functions, you can bypass this issue.

For example, if you have such a piece of code, obviously, the variables name, age, and status will become global variables.

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

If this function is not called, you can directly:

To access the objects or functions, you can:

This is the so-called module mode or Singleton mode, which is favored by Douglas crockford and widely used in Yahoo user interface library Yui.

If you want to call the methods in other places and do not want to use the object name myapplication before calling, you can return these methods in the anonymous function, or even return them in short:

Code Configuration

When others use the JavaScript code you write, it is inevitable that some code will be changed, but this will be very difficult, because not everyone can easily understand others' code, it is better to create a code configuration object. Others only need to modify some configurations in this object to implement code changes. Here is a detailed explanation of the Javascript configuration object, to put it simply:

  • Create an object named configuration in the code
  • Save all configuration changes, such as css id and class name, button label text, descriptive text, and localization language settings.
  • Set this object as a global object so that others can directly access and rewrite it.

You should do this in the last step. Here is an article for the reference of the five values before the code is delivered.

Interaction with the background

Javascript is a front-end language. You need other languages to interact with the background and return data. with Ajax, you can allow JavaScript to directly use the interaction with the background and process complex data in the background.

Javascript framework

Writing your own code to adapt to various browsers is a waste of time. You should select a javascript framework to let these complicated tasks be handled by the framework.

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.