JavaScript Introductory Tutorials Basics _javascript Tips

First, Introduction

1. What is JavaScript

JavaScript is a web scripting language developed by Netscape (Netscape) based on client-side browsers, object-oriented (based on) objects, and event-driven.

2. Why use JavaScript

Form validation
Web effects
Small games
Ajax

3. Quick Start

In the program, if you want to write JS code, there are two ways:

1 in an HTML file, in a pair of script tags, write directly

<script language= ' JavaScript ' >
  document.write (' hello ');
</script>

2 in JS, directly written in HTML, using a pair of script tags to directly reference

<script language= ' javascript ' src= ' demo01.js ' ></script>

Both of these cannot be reused in a pair of script tags, and references cannot write the contents of the file.

Second, the basic grammar
1. Basic Format

• JavaScript is case-sensitive
• Variable A and variable A are two variables
• JavaScript scripting must be embedded in an HTML file
• JavaScript script cannot contain HTML tag code

<script>
  document.write (' <table></table> ');
</script>

Write a script statement per line
You can add a semicolon at the end of a statement
JavaScript scripts can be saved independently as an external file

2, about the script label
Language: Referenced language JavaScript, PHP, C #, VBSCRIPT
SRC: Referencing an external JS file

3, about the variable
A variable is a container for storing values temporarily, and a variable can be stored with a value that changes
Variables must be declared before they can be used, variables are declared using VAR
Using the Var declaration: Local Variables
VAR declaration not used: global variable
Variable naming rules: The first character must be an English letter, or an underscore (_), followed by a character that can be an English letter, a number, an underscore, or a variable name that cannot be a reserved word for JavaScript.
Scope of variables: Global variables, local variables

4, data type (if type language, definition does not need to develop data type)
string: Strings ' ""
Number: Numbers 10, 10.01, 100
Boolean: Boolean True, False
Undefined: Not defined
Null: null
Object: Types of objects

<script language= ' JavaScript ' >

  //Use JS to describe a person's complete information
  var name= ' John ';
  var age=30;
  var marry=true;
  var height=1.8;

  document.write (' <ol> ');
  document.write (' <li> name ' +name+ ' </li> ');
  document.write (' <li> age ' +age+ ' </li> ');
  document.write (' <li> marriage no ' +marry+ ' </li> ');
  document.write (' <li> height ' +height+ ' </li> ');
  document.write (' </ol> ');

  function person () {}
  var p1=new person ();
  P1.name= ' Dick ';
  P1.age=20;2013/12/31
  document.write (p1.name+ ' <br> ');
  document.write (p1.age+ ' <br> ');
</script>

5, operator
1) Arithmetic operators
+ 、-、 *,/,%, + +, –
i++
++i

<script>

var i=10;
var j=i++;   First assign value and then add
var k=++i;   The value of
document.write (j) is added first;
document.write (k);

</script>

2) comparison operator

, <, >=, <=,!=, = =, = =,!==
What's the difference between = = and = =?
= =: Determine whether the value is equal
= = = The same type of judgment value is equal

<script>

var i=5;    Number
var j= "5";//string

if (i==j) {
  document.write (' equal ');
}
if (i===j) {
  document.write (' all equals ');
}
</script>

3) Logical operators
&&, | |,!
4) Assignment operator
=, + =, =, *=,/=,%=
Computes the left and right side of the operator and assigns the value to the left
String operators
+, + = (in PHP, with dots)

Third, the process structure

Sequential structure
Branch structure
Loop structure

1. Sequential structure
The code is executed one line after the other

2. Branch structure
If, else, else if, switch

3. Circulation structure
For, while, Do....while, for.....in
Small Games:

Guessing game: After entering the page, a random number of 1–500, pop-up input box, the user input a number, if this number is greater than the random number,

<script language= ' javascript ' >
  var n=math.round (Math.random () *500);  Random number
  alert (n);
  while (true) {
    var number=prompt (' Please enter a number between 0--500 ');//user Input
    if (number>n) alert (' Large ');
    if (number<n) alert (' small ');
    if (number==n) {
      alert (' ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~];
      break;
    }
  }
</script> 

Four, function
1, functions of the function
Code duplication use of
Modular programming

2. Grammar:

Before you can use a function, you define it before calling
The function definition has three parts: function name, parameter list, function body
Defining the format of a function
**function function name ([parameter 1, Parameter 2 ...]) {
function Execution Section;
return expression;
}**

Call Syntax:

function name (argument 1, Argument 2,......,);

3. code example

Example 1: About the definition and invocation of a function

Definition function
  display () {
    alert (' Hello ');

  function of the call
  display ();
  Display ();
  Display ();

Example 2: Questions about the parameters of a function

In the above question, the First,second is the formal parameter, the i,j is the argument
The change of parameter values does not affect the actual parameter during function execution.
Pass by value

Deliver schematic diagram by address:

In JS, object type is passed by address by default

function display (obj) {
  obj.name= ' Lisi ';
}

var p1=new Object ();
P1.name= ' Zhangsan ';

Display (p1);
alert (p1.name);//lisi
alert (p1);

The basic type of JS, is passed by value.

var a = 1;
function foo (x) {
  x = 2;
}
Foo (a);
Console.log (a); is still 1, unaffected by x = 2 Assignment

Look at the object again:

var obj = {X:1};
function foo (o) {
  o.x = 3;
}
Foo (obj);
Console.log (obj.x); 3, it's been modified!

Description O and obj are the same object, O is not a copy of obj. So it's not passed by value. But does this mean that the object of JS is passed by reference? Let's look at the following example:

var obj = {X:1};
function foo (o) {
  o =;
}
Foo (obj);
Console.log (obj.x); is still 1 and obj has not been modified to 100.

If you are passing by reference, modifying the value of the parameter o should affect the argument. But the value of modifying o here does not affect obj. Therefore, the objects in JS are not passed by reference. So what is the value of the object in JS how to pass it?
for object types, because objects are mutable (mutable), modifying the object itself affects the reference and reference copy of the shared object. For the basic types, because they are immutable (immutable), by sharing and by value delivery (call through value) there is no difference, so the JS basic type is not only consistent with the transfer by value, but also in accordance with the share delivery.

var a = 1; 1 is number type, immutable var b = A; b = 6;
According to the evaluation strategy for shared delivery, A and B are two different references (b is a reference copy of a), but they refer to the same value. Since the basic type Number 1 is immutable here, it says there is no difference between passing by value and sharing by share.

Immutable (immutable) properties of basic types
The base type is immutable (immutable), and only objects are mutable (mutable). For example, a numeric value of 100, a Boolean value of True, false, it does not make sense to modify these values (for example, turning 1 to 3, and turning true to 100). More easily misunderstood, is a string in JS. Sometimes we try to "change" the contents of a string, but in JS, any "modify" operation that appears to be a string value actually creates a new string value.

var str = "abc";
STR[0]; "A"
str[0] = "D";
Str is still "ABC"; the assignment is invalid. There is no way to modify the contents of a string

objects are different, and objects are mutable.

var obj = {X:1};
obj.x = m;
var o = obj;
o.x = 1;
obj.x; 1, modified
o = true;
obj.x; 1, does not change by O = True

This defines the variable obj, the value is object, and then sets the value of the Obj.x property to 100. Then define another variable o, the value is still the object object, at which point the value of obj and O Two variables points to the same object (a reference that shares the same object). So modifying the contents of the object has an effect on both obj and O. However, the object is not passed by reference, and the O value is modified with o = True and does not affect obj.

Example 3: About the return value problem of a function

 Functions Display (First,second) {
    //function encounters return returns immediately, followed by code that does not perform returning
    first+second;
  }

  var i=10;
  var j=20;
  Alert (display (I,J));
  document.write (Display (i,j));

Example 4: About anonymous functions

  /*var i=function () {
    alert (' Hello ');
  };
  I ();/
Var i=10 variable can save data or save address

function display () { 
} Add a variable called display under the Window object that points to the first address of the function 
Window.i=display We let the Window object under I point to the first address of this function 
display () ======= I ();

Example 5: Self-invoking anonymous function

<script language= ' JavaScript ' >

  /*var i=function () {
    alert (' Hello ');
  I ();/(



  function (a) {
  alert (a);
  Alert (' Hello,js ');
  }) (Ten)

</script>
function () {}: equivalent to returning the first address 
(function () {}): Consider this part as a whole ( 
function () {}): equivalent to finding this address and executing

This style of writing: You can avoid the problem of the function in the code library, and the above code will only be executed once at runtime, and generally used for initialization work.

Example 6: Global variables and local variables

 <script>

  function display () {
    //var i=20;//local variables function only in local scope
    i=20;    Globally, the value of the global I is modified to
  display ();
  alert (i);
</script>

The definition within the function is local, otherwise it is the global
If a variable within a function does not have a VAR declaration that directly affects the global

Why isn't var the global?
is because, in JS, if a variable does not have a VAR declaration, it will automatically go to the previous level to find the variable declaration statement, if found, use, if not found, continue to look up to the global scope, if the global still does not have the variable declaration statement, Then it will be automatically declared in the global scope, which is the scope chain in JS

code example:

<script>

  var i=10;
  function fn1 () {
    var i=100;
    function fn2 () {
      i=1000;
      function Fn3 () {
        i=10000;
      }
      Fn3 ();
      Console.log (i);//10000
    }
    fn2 ();
    Console.log (i);//10000
  }
  fn1 ();
  Console.log (i);//10

</script>

Local access global use scope chain
Global access local can be simulated using (function) closures.

V. Use of arugments

Inside a function, you can use the Arguments property, which represents the formal parameter list of a function, which is represented as an array

Example 1: When defining the display function, its argument number must be consistent with the number of parameters, sometimes, we define the function, the number of formal parameters can not be fixed, how to solve?

<script>

function display () {
  //No formal parameters are defined, then all the form attendees are automatically stored in the arguments attribute array for
  (Var i=0;i< arguments.length;i++) {
    document.write (arguments[i]+ ' <br> ');
  }
}

Display (' Lisi ', ' Zhangsan ', ' Wangwu ');  Three actual parameter
display (' Zhangsan ', ' Lisi ', ' Wangwu ', ' Xiaoqiang ', ' Wangcai ');//Five arguments


</script>

If the parameter number is indeterminate when defined, you can save all arguments by arguments

Example 2: Use the JS function to calculate Employee payroll per company

<script>

  function display () {
    var sum=0;//Total for
    (Var i=0;i<arguments.length;i++) {
      sum+= Arguments[i];
    }
    document.write (sum+ ' <br> ');
  }

  A company
  display (10000,2000,5000);
  B Company
  display (1000,2000,5000,8000,10000);
</script>

The above is the whole content of JavaScript tutorial, hope to be helpful to everybody's study.