A, JavaScript development
1. Birth
JavaScript because the Internet was born, followed by the development of the browser and development.
In 1990, the European Institute of Nuclear Energy (CERN) scientists in the Internet (Internet) based on the invention of the World Wide Web (World Wide Web), you can browse files from the Internet again. ( The Internet is the line, the major service agreements as well as an aggregate of hardware and software, electronic data transmission via TCP, IP protocols .Internet has provided the World Wide Web WWW, file transfer FTP, E-mail E-mail, Telnet remote login, etc. is the World Wide Web exists on the Internet, is a collection of numerous web sites and web pages together, constitute the main part of the Internet. If you use the Internet as a foundation, the World Wide web can be seen as the application of the Internet )
In 1992, the US National Center for Supercomputing Applications (NCSA) developed the first in human history browser Mosaic.
In 1994, NCSA programmers a joint venture capitalist company was founded Mosaic Communications, later renamed Netscape. Develop a new generation browser, Netscape Navigator1.0 version for ordinary users, the market share of more than 90% in one fell swoop.
Netscape company soon found a need for a browser can be embedded scripting language web pages to control behavior. Because then the speed is very slow and the network is very expensive, some operations do not require the server to complete, these operations can be completed in the browser, thus improving efficiency. They envisaged the scripting language is: 功能不需要太强，语法简单，容易学习和部署。coincides with the advent of Sun's java, the two companies powerful combination, NetScript company wants to use the momentum of the Java language, Sun's then their influence extended to the browser, in 1995, they ten days to hire a programmer to design completed the first version of the language, named as JavaScript, China announced that JavaScript is Java supplement.
- The basic syntax: learn C language and Java language
- Data structures: learning Java language, including the value and the original value is divided into two major categories of objects
- Idiom: Schema language and learn AWK language, the introduction of closures
- Prototypal inheritance model: Self learn language
- Regular Expressions: Perl Language Reference
- String and array processing: learning Python language
2. JavaScript and Java relations
JavaScript objects and the basic grammar system, is designed to mimic Java.
JavaScript is a language function independent of data types and is java based syntax biggest difference between the two objects and prototype inheritance chain.
JavaScript does not need to compile, directly executed by the interpreter.
3. The relationship between JavaScript and ECMA
In 1996, Microsoft has developed an imitation of similar JavaScript language JScript, built in IE3.0, Netscape situation the company is facing the loss of dominance in the browser scripting language. Fail to beat the thigh arm, Netscape has found a big brother - the International Organization for Standardization ECMA (European Computer Manufacture Association) to resist Microsoft.
In 1997, ECMA 262 standard file organization published (ECMA-262), which defines the standard browser scripting language, and this language has become ECMAScript.
4. JavaScript version
In 1997, ECMAScript 1.0 release.
In 1998, ECMAScript 2.0 release.
In 1999, ECMAScript 3.0 release.
2007-2009, ECMAScript 4.0 draft release of the 3.0 version made a substantial upgrade, but the draft is too radical, serious differences between the parties, to suspend the development of 4.0, which will involve improving the existing functionality of a small part, published as ECMAScript 3.1, shortly after the meeting, renamed ECMAScript 5.
In 2011, EMAScript 5.1 release, and become the ISO international standard, by 2012, all major browsers support all the features of ECMAScript 5.1.
2013-2015 discuss the release ECMAScript 6, ECMAScript 6 and officially released in 2015, changed its name to ECMASCript 2015.
5. Development - Internet standards (RFC)
- The draft Internet (Internet Draft)
- Proposed standard, from the beginning of this stage becomes the RFC documents (Proposed Standard)
- The draft standard (Draft Standard)
- Internet standards (Internet Standard)
Two, JavaScript modular development
Modular refers to a complex system to a decomposition of a module, the advantages are:
① code reuse, easier management code, while the code behind to facilitate maintenance and modification
② a separate file is a separate module, a separate scope. Outwardly exposed only specific variables and functions, to avoid pollution of the global variables.
1. No Modular
Ajax appeared before, JS more used to verify a form on the Web page, simple animation.
In 2006, ajax concept was put forward, the front has the initiative to send a request to the server and operational ability to return data, the traditional web pages slowly to "rich client" development. More and more front-end business logic, code, more and more, so some of the problems on the exposed:
- Conflicts with global variables
- Function naming conflicts
- Dependence of poor management
Summarize "modular" concept to be played what pain points need to be addressed:
- How to secure a package of code modules? Any code that does not contaminate the outer module
- How to uniquely identify a module?
- How elegant the API module is exposed to? Without increasing global variables
- How easy to use is dependent module?
2. CommonJS
In 2009, nodejs turned out, ushered in a new era, people can use js to write server-side code.
CommonJS module specification is divided into three parts: the module reference (require), the module definition (export), designated module (Module1)
- Module should follow a uniform labeling rules
- Require global function defined, the label introduced by the other modules, i.e., its execution result of the API dependency module exposed, if introduced into the module also contains the relevant dependent, those dependencies are sequentially loaded, if introduced into the module fails, the function should require an exception report
- Modules to define itself while exposing themselves to the outside world through variable export, export can only be an object that is exposed API properties for this object
Each file is a module, has its own scope. Each internal module, module variable represents the current module is an object, its exports attribute is the external interface. module.exports property represents the external output of the current module interfaces, other files to load the module, in fact, read module.exports variables.
require the user to load module command file.
3. AMD
AMD (Asynchronous Module Definition) means "Asynchronous Module Definition." It asynchronously load module load module does not affect the execution of the statement behind it. This statement is all dependent modules, are defined in a callback function, wait until after the completion of loading, the callback function will run.
AMD also require statement using the load module, but unlike the CommonJS, which requires two parameters:
require([module],callback)The first parameter [module], is an array, which is a member of the module to be loaded; the second argument callback, the callback function after loading.
AMD is using JavaScript specification in Layui.
layui.use(['laydate', 'layer', 'table', 'upload', 'slider'], function(){
})AMD is RequireJS output, JS files can be loaded asynchronously, is a front-dependent, asynchronous defined framework.
4. CMD
CMD (Common Module Definition) common module definition, and the definition of the module which provides a load module execution demand. The written format specification defined the basic module and the basic rules of interaction.
CMD is not dependent on the front, JQuery plug-in is loaded by require, depending nearby, in what use to plug it in any place require the plug-in, use namely return, which is a concept of synchronization.
//CMD
define(function(require, exports, module) {
let a = require('./a');
a.doSomething();
···
let b = require('./b'); // 依赖可以就近书写
b.doSomething();
...
})
// AMD 默认推荐的是
define(['./a', './b'], function(a, b) {
// 依赖必须一开始就写好
a.doSomething()
...
b.doSomething()
...
}) 5. ES6
CommonJS for servers, AMD for the browser, ES6 on the level of language standards, to achieve the function modules, and achieve quite simple, and can replace CommonJS AMD specification, become generic browser and server module solutions. Module dependencies can be determined, as well as input and output variables when ES6 design module of static is to try to make the building. CommonJS and AMD modules, these things can only be determined at runtime.
ES6 module is not the object, but the code is explicitly specified by the export command output through the import command input.
import { stat, exists, readFile} from 'fs';The above is the essence of the code module loaded fs from three methods, other methods are not loaded. This load is called "Loading a compile-time" or static load that can be done ES6 module loads at compile time, more efficient than loading CommonJS modules.
Reference article: