Step 7: Make JavaScript better-

You only need to follow these seven steps to greatly improve the quality of your JavaScript project. By using this workflow, errors will be reduced and many processing optimizations will be made to give users a pleasant online browsing experience ....,. Dan Odell introduced his seven-step write-out plan, which is the most useful tool in the process of simplification.

With the improvement of browser performance and the steady adoption of new HTML5 programming interfaces, the volume of JavaScript on Web pages is gradually increasing. However, a poorly written program code has the potential to break the entire website, frustrating users and driving away potential customers.

Developers must use all the tools and technologies they can use to improve the quality of their code and be confident that each execution is predictable. This is a deep topic in my mind and I have been working for many years to find steps to follow in a group of development processes to ensure that only the highest quality code can be published.

You only need to follow these seven steps to greatly improve the quality of your JavaScript project. With this workflow, errors will be reduced and many processing optimizations will be made to give users a pleasant online browsing experience.

01. Code

First, call the strict mode of ECMAScript5 and a "strict mode" statement in your function, and use the design mode of this module. In the self-executed function closure, use the independent code module in the sandbox to minimize the use of global variables. Use any external dependency to keep the global variable module clear and concise. Only third-party libraries and frameworks that have been established and proven, and have passed tests and achieved good results, and keep your functions in a small value, isolate any business logic or data from your module operations and other view layer code.

Large projects with multiple developers should follow a set of established coding principles, such as Google's JavaScript style guide and require stronger code management rules, including using a library, for example, RequireJS uses software package management to perform strict dependency management using asynchronous module definition (AMD) and Bower or Jam (client library management tool) refer to the specific version of your dependency file and adopt the structure design mode, such as the observer mode, to facilitate loose coupling communication between different code modules. This is also a wise idea: Use a code repository system, such as Git or Subversion, to back up your code on the cloud through services such as source code or magic bean, provides the ability to restore to a previous version, and creates a code branch for a more advanced project to execute different functions, merge them together before completion.

02. File

Using structured annotation block formats such as YUIDoc or JsDoc to file functions, any developer can understand the purpose without studying its code, which can reduce misunderstandings. You can use the Markdown syntax to provide more extensive and lengthy comments and instructions. Use the associated command line tool to automatically generate a document Website: Based on these structural comments, it is consistent with any modifications made in your code to the latest status.

　　03. Performance Analysis

Periodically run a static code analysis tool, such as JSHint or JSLint, for your code. These checks for known encoding defects and potential errors, such as forgetting to use strict mode or referencing undeclared variables, and missing parentheses or semicolons. Tool controls that fix any problems to improve the quality of your code. Try setting the default options for your project team to enhance the coding standard, such as indent each line by space, where to place curly brackets, the number of single or double quotation marks is used in the entire code file.

04. Test

A unit test is one of the functions of a small independent function execution: execute a function from your specific primary code library to confirm that it outputs an expected value. To improve your confidence, the code will write the frameworks used, such as Jasmine or QUnit, for each functional unit test, using expected and unexpected input parameters, as expected. But never forget the edge situations!

Run these tests on multiple browsers across multiple operating systems. By using this service, such as BrowserStack or Sauce Labs, You can accelerate testing on cloud-based virtual machines. These two services provide an API that allows your unit test to run automatically in multiple browsers at the same time. Once they are completed, the results will be fed back to you. As a bonus, if your code is stored on GitHub, You can take BrowserSwarm, a tool that automatically runs your unit test when you submit your code.

05. Measurement

Code override tools, such as Istanbul, measure the number of lines of code that are executed when your unit test runs on your function and report the percentage of the total number of lines of the Code. Run a code coverage tool for your unit test and add additional tests to increase your coverage score to 100%, giving you more confidence in your code.

The complexity of functions can be measured by holster's complexity measurement: The equation established by computer scientist Morris holster in 1970s, the complexity of a function is based on cycles, branch and the function calls it contains to quantify: the complexity of a function can be measured using Halstead's complexity measure. When this complex score is reduced, the easier it is to understand and maintain this function, reducing the possibility of errors. The command line tool Plato measures and visualizes the data generated with JavaScript code complexity, helps identify the functionality that can be improved, and stores the previous results, allowing you to follow the progress of quality over time.

06. Automation

The Task runner, such as Grunt, is used to automatically operate on the process of file preparation, analysis, testing, coverage and complexity report generation, thus saving you time and effort, and increase the chance of solving any quality problems. Most of the tools and test frameworks highlighted in this article are associated with Grunt, which helps you improve the quality of your workflows and code without a single finger.

　　07. Handling exceptions

Similarly, in some cases, your code will encounter an error when it is running. Use the "try... Catch" statement to properly handle running time errors and limit the impact of behavior on your website. Use the network service to record errors during running. Use this information to add new unit tests to improve your code and eliminate these errors one by one.

　Steps to success

These seven steps help me create some of my most proud code for my career so far. They are also a good foundation for the future. In your own project, we promise to use these steps to produce high-quality JavaScript code. Let's work together to improve the network, step by step to success.

The above are 7 steps: Make JavaScript content better. For more information, see PHP Chinese website (www.php1.cn )!