Directory
1 History 2 clarifying misunderstandings 3 basic concepts 4 features 5 different from Java 6 development tools
History
Probably in 1992, a company called Nombas began developing an embedded scripting language called C-minus (C-minus-minus, or CMM). This scripting language is bundled in a shared software product called Cenvi, and Nombas developed a version of Cenvi that can be embedded in a Web page when Netscape Navigator is emerging. These early experiments, called espressopage (Espresso-like pages), represent the first client-side scripting language to be used on the World Wide Web. And Nombas didn't expect its idea to be an important cornerstone of the Internet.
Clarifying misunderstandings
* is JavaScript a variant of Java?
JavaScript was originally designed for Java inspiration, and one of the goals of the design was "look like Java" [2], so there are many similarities in syntax, and many names and naming conventions are borrowed from Java. But in fact, the main design principles of JavaScript are derived from self and scheme[3], which is fundamentally different from Java. Its approximation to the Java name was the result of Netscape's agreement with sun for marketing purposes.
* is JavaScript the same as JScript?
To gain a technical advantage, Microsoft has introduced JScript to the scripting language of JavaScript. For interoperability, ECMA International (formerly the European Association of Computer Manufacturers) established the ECMA-262 Standard (ECMAScript). Now both belong to the realization of ECMAScript.
* is JavaScript a simple language?
Although JavaScript is promoted and advertised as a scripting language for non-programmers, rather than as a programming language for programmers, JavaScript is a very rich language with the same complexity or complexity as other programming languages. In fact, you must have a solid understanding of JavaScript in order to use it to write more complex programs.
Basic concepts
Here is a brief introduction, in a later example, the process of making a specific explanation of its role.
1. Operators
An operator is a series of symbols that perform a manipulation, and it has seven classes:
Assignment operators (=,+=,-=,*=,/=,%=,<<=,>>=,|=,&=), arithmetic operators (+,-, *,/,++,--,%), Comparison operators (>,<,<=,>=,==,== =,!=,!==), logical operators (| |,&&,!), conditional operations (?:), displacement operators (|,&,<<,>>,~,^), and string operators (+).
Maybe a lot of people don't know what "= = =".
Here, I explain to you, in javascript "= = =" is congruent only "= = =" On both sides of the memory address is equal to return the true
and the "= =" will return TRUE if the value is equal.
For example: Null==undefined will return true, but null===undefined will return false!
2. Expression
The combination of operators and operands is called an expression, usually divided into four classes: an assignment expression, an arithmetic expression, a Boolean expression, and a string expression.
3. Statements
A JavaScript program is made up of several statements, which are instructions for writing a program. JavaScript provides complete BASIC programming statements, which are:
An assignment statement, a switch SELECT statement, a while loop statement, a For Loop statement, a For Each loop statement, a Do and loop statement, a break loop abort statement, a continue loop interrupt statement, a with statement, a try...catch statement,
If statement (if:). Else,if...else If ... ), let statement.
4. Functions
A function is a named statement segment that can be used as a whole to be cited and executed. There are a few things to note about using functions:
1) functions are defined by the keyword function (which can also be constructed by the function constructor);
2) functions defined with the Function keyword can be called anywhere within a scope (including statements that define a function), and must be defined with the VAR keyword to be called;
3) The function name is the name that is referenced when the function is called, it is sensitive to case, and the function is not written in the wrong name when it is called;
4) The parameter represents the value passed to the function or operation, which can be a constant, or a variable, or a function, which can be accessed through the arguments object (the arguments object is a pseudo-array, the property callee refers to the called function) to access all parameters;
5) The return statement is used to return the value of an expression.
6) The yield statement throws an expression and interrupts the function execution until the next call to next.
The general functions are in the following format:
function MyFunction (params) {
The executed statement
}
function expression:
var myfunction=function (params) {
The executed statement
}
An anonymous function, which is often passed as a parameter between other functions:
Window.addeventlistener (' Load ', function () {
The executed statement
},false);
5. Objects
An important function of JavaScript is the object-oriented function, which can be developed in a more intuitive, modular and reusable way through object-based programming.
A set of properties that contain data and methods that manipulate the data in a property, called an object. For example, to set the background color of the page, the object is the document, the property name used is bgcolor, such as document.bgcolor= "Blue", that is, the color of the background is blue.
6. Events
The action that occurs when a user interacts with a Web page, called an event. Events can be raised by the user, or the page may change, and even events that you can't see (such as an AJAX interactive progress change). Most things are triggered by the user's actions, such as: the user presses the mouse button, the Click event is generated, if the mouse pointer on the link to move, resulting in mouseover events and so on. In JavaScript, events are often used in support of event handlers.
The way to handle the event is to use the AddEventListener () function, which has three parameters: the event, the function that is thrown, and whether to use event snapping. For security, it is recommended that the third parameter is always set to false;
The traditional approach is to define the element's on ... event, which is a "on" before the event parameter in the method. The event model of IE uses attachevent and dettachevent to bind and delete events. There are two stages of capturing and bubbling events in JavaScript, but traditional bindings only support bubbling events. Learning JavaScript is a faster and more effective way is to familiarize yourself with some basic concepts, and then find a few others to design the program carefully and carefully analyze again, and then make changes, and then see whether it can achieve the intended purpose, constantly extrapolate, can deepen the understanding of some parameters, design methods, And can quickly improve their level. In addition, to remind you: JavaScript is sensitive to case, especially some objects, methods, properties of the case must be consistent, to develop a good habit, otherwise in the debugging program can be exhausted you.
7. Variables
such as var myvariable = "some value";
The variable has its type, the type of myvariable in the previous example is string (string)
Common types supported by JavaScript are:
Object: Objects
Array: Arrays
Number: Numbers;
Boolean: Boolean, with only true and false two values, which are the least memory-intensive of all types;
NULL: A null value, the unique value is null;
Undefined: No variables defined and assigned
In fact, the JavaScript variable is a weakly variable type, and you assign it to him as a string.
It's a number, he's plastic. Is true and false he is the Boolean type (note that it cannot be quoted, otherwise it will be treated as a string).
Characteristics
Being able to interact and contain more active elements, it is necessary to embed other technologies in the Web pages. Such as: JavaScript, VBScript, Document Object Model (DOM, documents objects models), layers and cascading style Sheets (CSS, cascading style sheets), here is the main JavaScript. So what is JavaScript? JavaScript is a new programming language adapted to the needs of dynamic Web authoring, and is now increasingly used in Internet web page making. JavaScript is a scripting language (scripting language) developed by Netscape Corporation, or a description language. On the basis of HTML, you can use JavaScript to develop interactive Web pages. The advent of JavaScript enables a real-time, dynamic, interactive relationship between the Web page and the user, allowing the Web page to contain more active elements and more exciting content. Running a program written in JavaScript requires a browser that can support JavaScript language. Netscape Company Navigator 3. More than 0 browsers can support JavaScript programs, Microsoft Internet Explorer 3. Browsers with more than 0 versions basically support JavaScript. Microsoft also has its own JavaScript, called JScript. JavaScript and JScript are basically the same, but they differ in some detail. JavaScript is short, and is executed on the client, which greatly improves the browsing speed and interactive ability of the Web page. It is also a simple programming language specifically tailored for Web pages.
JavaScript makes Web pages more interactive. JavaScript simplifies the regular repetition of HTML segments, reducing download time. JavaScript responds to the user's actions in a timely manner, checking the submission form for immediate inspection without wasting time with CGI verification. JavaScript is characterized by endless, as long as you are creative.
Different from Java
Java's to JavaScript is like car (car) to carpet (carpet).
--a JavaScript discussion group from Usenet
China's local version of the argument should be this: Java to JavaScript is like Lei Feng and Leifeng Pagoda relationship.
A lot of people see Java and JavaScript have "Java" four words, think they are the same thing, even my own at the same. In fact, the Java and JavaScript languages are relevant, but their connections are not as close as you might think. First, the Java language is the product of Sun Microsystems Company, and JavaScript is the product of Netscape company.
Second, they are functionally different: Java applets that run on the client are called Java applet, which is embedded in the Web page and has its own separate running window. Java applets are pre-compiled, and an Applet file (. Class) opens for reading with Notepad, which is simply not understandable. Java applets are powerful, with access to protocols such as HTTP, FTP, and even viruses on your computer (precedent already). JavaScript, by contrast, is less capable. JavaScript is a "script" that directly writes code to an HTML document, compiles and executes it when the browser reads it, so you can view the JavaScript source code by viewing the HTML source file. JavaScript does not have a separate running window, and the browser's current window is its running window. They are the same point, I think only Java as a programming language.
Java is a generic term for the Java programming language and Java platform introduced by Sun Microsystems Company in May 1995. Java-enabled HotJava browser (Java applet support) shows the charm of Java: Cross-platform, dynamic web, Internet computing. Since then, Java has been widely accepted and has driven the rapid development of the web, and common browsers now support Java applets. Java technology, on the other hand, is constantly being updated.
The Java platform consists of a Java virtual machine (Java VM) and a Java application Programming interface (application programming Interface, short API). The Java application programming interface provides an operating system-independent standard interface for Java applications, which can be divided into basic and extended sections. After installing a Java platform on a hardware or operating system platform, Java applications can run. The Java platform is now embedded in almost all operating systems. This allows the Java program to be compiled once and run on a variety of systems.
Java consists of three system javase,javaee,javame.
Development tools
JavaScript programs are plain text and do not require compilation, so any plain text editor can edit JavaScript files. Not only are there good code highlighting in Dreamweaver CS4, but there are also full code hints and error hints that are very powerful compared to other editors.
How to use
One, JavaScript in the use of Web pages
There are two ways to add JavaScript to a Web page:
1. Add HTML document directly
This is the most common approach, and most Web pages that contain JavaScript use this approach, such as:
<script type= "Application/javascript" >
<!--
Document.writeln ("This is javascript! Use the direct insertion Method! ");
-javascript End--
</script>
In this example, we can see a new tag: <script>......</script>, while <script language= "Javascript" > Used to tell the browser that this is a program written in JavaScript and needs to be interpreted by a corresponding interpreter. (The new standard has been recommended: <script type= "Application/javascript" >)
HTML annotation Tags <!--and-->: Used to remove JavaScript source code not recognized by the browser, which is useful for browsers that do not support JavaScript language.
Note When you insert a script tag in a non-XHTML document, if you do not reference an external file, you should add a CDATA declaration inside the script to avoid browser parsing errors that are caused by the greater than and less than operators
-javascript end: A double slash indicates that the comment portion of the JavaScript, that is, the characters from//start to the end of the line are ignored. As to the document used in the procedure. The Write () function indicates that the text in parentheses is exported to the window, which is described in more detail later. Another point to note is that the location of the,<script>......</script> is not fixed and can be included in There is also a more advanced version of the embed script that uses the CDATA syntax in HTML (Character Data, which is to treat the text in CDATA All as plain text, unless you encounter a CDATA end)
<script language= "javascript" type= "Text/javascript" ><!--//--><! cdata[[//><!--
JavaScript code
--><!]] ></script>
2. Quoting method
If there is already a JavaScript source file (usually with JS as the extension), you can use this reference to increase the utilization of your program code. Its basic format is as follows:
<script src= "url" type= "Text/javascript" ></script>
The URL is the address of the program file. Similarly, such statements can be placed on the head of the HTML document or any part of the body. If you want to achieve the effect of the example in "Direct insert mode," You can first create a JavaScript source code file "Script.js" with the following content:
Document.writeln ("This is javascript! Use the direct insertion Method! ");
You can invoke the program in a Web page like this: <script src= "script.js" type= "Text/javascript" ></script>.
You can also make JavaScript versions at the same time when importing files, for example: <script src= "script.js" type= "text/javascript; version=1.8 "></script>
Note: The contents of the script tag that specify the SRC attribute will be ignored.
Debugging of Javascript Scripts
With JavaScript programming in depth, you will begin to understand the opaque error messages given by JavaScript. Once you understand the general mistakes you make, you will soon know how to avoid them, so you will have fewer errors in the code you write. Programming is actually a technology that can progress rapidly over time. But no matter how skilled you become, you still have to spend some time debugging your code. If you have done homework, or have had jacascript programming experience, you will know that quite a lot of time is spent on debugging. It's normal-it's just one of the things programmers have to do. In fact, according to a lot of research, programmers spend an average of 50% of their time fixing errors in the code.
Tips for debugging:
Depending on the browser's prompt information
Choosing a browser is very important, different browser error prompts are different, in the browser error message is the most understandable, the fastest to find out the error, that is, Firefox and opera. They will give detailed reasons for the error and the line number.
Using the Debugging Tools
If you are a Firefox user, you can search for some components for Web development in the Web page where you add components
Recommendation: Firebug
A very good component that can point out errors in your script, view the DOM tree, view Cookie,ajax communication, and also have CSS debugging tools, and there are many firebug extensions.
JavaScript debugger
This is a debugging tool developed by Mozilla, the project code named Venkman, and the Gecko JavaScript parser seamless integration, the function is very powerful.
Clear browser Cache
Sometimes the browser will be in the page when it is modified, but still use the page in the cache to display, it is best to force refresh the page to reload the data, if not yet clear the cache.
Output variables
If you use Firebug debugging, it is convenient to use Console.log () in the script to output the value of the variable, and fortunately, Firebug will also parse your output variables, display a clear variable structure in the console
If you don't have a firebug, you can use alert instead, but when you have hundreds of variable outputs, you're probably forced to close your browser. It is also a good solution to put a debug div in a Web page.
Writing a first JavaScript program
<script type= "Text/javascript" >
<!--
document.write ("Hello, world!")//is displayed directly in the browser window.
Alert ("Hello, world!")//Open dialog window display.
-
</script>
<body>
</body>
JavaScript code by <script type= "Text/javascript" >...</script> description. JavaScript scripts can be added between the identity <script type = "Text/javascript" >...</script>. Alert () is a JavaScript window object method whose function is to eject a string that has an OK dialog box and displays (). Through <!--...//--> logo Description: If you do not know the JavaScript code of the browser, all the identities in it are ignored, and if so, the result is executed. Using annotations This is a good programming habit that allows others to read your language. JavaScript ends with a </Script> tag.
JavaScript and Dom
The DOM is the short name of the Document Object model, which is a way for JavaScript to interact with the page, to dynamically modify nodes, elements, attributes, and so on in the document.
Dom is useful not only for XHTML documents, but also for all XML document DOM.
Level of the DOM
Level 1: Basic node operation level includes
Level 2: Added support for style sheets, document display, event handling, etc.
Level 3: You can load and save documents with JavaScript to check for document errors
Object-oriented JavaScript
There is no concept of class in JavaScript, but JavaScript uses a model called prototype inheritance, and JavaScript has concepts such as scopes, closures, inheritance, context objects, and so on.
Scope
Scope refers to the domain in which a variable exists, and the scope of the JavaScript script in the document is window. Separating scopes in javascript,function and let
For example, below is an example of this scope:
var myvariable= "Outside";
function MyFunction () {
var myvariable= "Inside";
alert (myvariable);
}
MyFunction ();
alert (myvariable);
The result is a dialog box that pops up "inside", and then pops up a dialog box with "Outside", which is where function establishes a scope, and the first hint is the myvariable in the MyFunction scope.
Here is an example of a let control scope:
var myvariable= "Outside";
Let (myvarialbe= "inside") alert (myvariable); Inside
alert (myvariable); Outside
Let statements are added in JavaScript 1.7.
Closed Package
Closures are also related to scopes, which refer to a closed scope (variables and functions that have external variables, functions that cannot be accessed), and generally use an anonymous function to make a closure.
(function () {
var myvariable= "Private",
})();
alert (myvariable); Undefined
Context Object
The context object refers to the This object. It is an object that can only be read and cannot be assigned directly (that is, you can only assign values to properties and methods owned by this). Context objects in JavaScript can be said to play incisively and vividly.
If you use this in an object, this is the object
var obj={
Getthis:function () {
return this;
}
};
alert (obj.getthis===obj); True
Similarly, the JavaScript object in the scope has been referred to as the window, so the following example
alert (window===this);
will also prompt true.
The context object in the event listener is the object in which the event occurred
Document.body.addEventListener (' click ', function () {
alert (this===document.body); True
},false);
This refers to the instance in the constructor
function person (name) {
This.name=name;
}
var sam=new persom ();
This is the SAM.
JavaScript Library
Library refers to the readily available code resources that can be easily applied to existing development systems. The library not only provides a quick solution for most of the daily Dom textbook into work, but also offers many unique tools. Although libraries are easy to use, they are not a solution to all your problems. Before using the library, be sure to really understand the DOM principle of JavaScript.
These libraries are usually one (or more) JS files, as long as they are imported into your Web page can be used.
The libraries that are used to check are:
New members in the Jquery:javascript library, providing CSS and XPath selectors for finding elements, Ajax, animation effects, etc.
Dojo: A huge library that includes a lot of things, Dijit and Dojox are the extensions of dojo, and almost all of the various JavaScript programs you want are included.
Prototype: A very popular library that uses a prototype chain to add a lot of good functions to JavaScript
Yui:yahoo! User interface, very use, offers a variety of solutions.
How to increase the speed of JavaScript
Recursion is one of the big enemies that slows down the speed of a script. Too many recursion will make the browser more and more slow until dead or inexplicably suddenly auto-exit (pop-up Script unresponsive dialog box in Firefox), so we must solve this series of performance problems in JavaScript. In the second installment of this series, I briefly described how to replace too many recursive calls in a function with memoization technology. Memoization is a technique that caches the results of previous operations, so that we do not need to recalculate the results that have already been computed. Memoization is simply too useful for functions that are computed by recursion. The Memoizer I'm using now is written by Crockford and is mainly used in recursive operations that return integers. Of course not all recursive functions return integers, so we need a more general memoizer () function to handle more types of recursive functions.
function Memoizer (fundamental, cache) {cache = Cache | | {} var shell = function (ARG) {if (! ( Arg in cache) {Cache[arg] = fundamental (shell, ARG)} return Cache[arg]; }; return shell;} This version of the function is a little different from the version written by Crockford. First, the order of the parameters is reversed, the original function is set to the first parameter, and the second parameter is the cache object, which is an optional parameter, because not all recursive functions contain the initial information. Inside the function, I convert the type of the cached object from an array to an object so that this version adapts to recursive functions that are not returning integers. In the Shell function, I use the in operator to determine if the parameter is already contained in the cache. This is more secure than test type undefined, because undefined is a valid return value. We also use the Fibonacci sequence mentioned earlier to illustrate:
var Fibonacci = Memoizer (function (recur, n) {return recur (n-1) + recur (n-2);}, {"0": 0, "1": 1}); Similarly, execute Fibonacci (40) This function, it will only call 40 times for the original function, instead of exaggerating 331,160,280 times. Memoization is great for recursive algorithms that have a strictly defined set of results. However, there are indeed many recursive algorithms that are not suitable for optimization using the Memoization method.
One of my professors at school always insisted that any use of recursion, if necessary, could be replaced with an iteration. In fact, recursion and iteration are often used as a way to compensate for each other, especially in the case of another problem. The technique of converting a recursive algorithm to an iterative algorithm is also independent of the development language. This is important for JavaScript because many things are restricted in the execution environment (the importance in JavaScript is greater, though, because the resources of the EXECU tion environment is so restrictive.). Let's look back at a typical recursive algorithm, such as a merge sort, which requires the following code to implement this algorithm in javascript:
function merge (left, right) {var result = []; while (left.length > 0 && right.length > 0) {if (Left[0] < Right[0]) {Result.push (Left.shift ());} else {Result.push (Right.shift ());}} Return Result.concat (left). Concat (right);} Recursive implementation of the merge sorting algorithm function mergesort (items) {if (items.length = = 1) {return items;} var middle = Math.floor (Items.length/ 2), left = Items.slice (0, middle), right = Items.slice (middle); Return merge (MergeSort (left), MergeSort (right));} Call the MergeSort () function to process an array, and you can return a sorted array. Note Each call to the MergeSort () function will have two recursive calls. This algorithm cannot be optimized using memoization because each result is calculated and used only once, even if the result is buffered. If you use the MergeSort () function to process an array of 100 elements, there will be a total of 199 calls. An array of 1000 elements will execute 1999 calls. In this case, our solution is to convert the recursive algorithm to an iterative algorithm, that is to introduce some loops (for the algorithm, you can refer to this "List processing:sort Again, naturally").
Resources:
1.https://developer.mozilla.org/en/core_javascript_1.5_guide
2.https://developer.mozilla.org/en/core_javascript_1.5_reference
Javascirpt Historical Clarification misunderstanding basic conceptual features programming language web2.0 Web javascript-javascirpt knowledge Daquan