JavaScript - 语法

发表于:2016-07-11，更新于:2017-08-26，By Sally

大纲

1. 1. JavaScript Output
2. 2. JavaScript Syntax
3. 3. JavaScript Variables
   1. 3.1. Re-Declaring JavaScript Variables
4. 4. JavaScript Operators
5. 5. JavaScript Object
   1. 5.1. Do not declare strings, numbers, and booleans as object
   2. 5.2. JavaScript objects cannot be compared
   3. 5.3. JavaScript String
   4. 5.4. JavaScript Number
6. 6. JavaScript Scope

JavaScript Output

JavaScript does not have any built-in print or display functions.

JavaScript can “display” data in different ways:

• writing into an alert box, using window.alert()

• writing into the html output using document.write()

  using document.write() after an html document is fully loaded, will delete all existing html. so, this method should only be used for testing.

• writing into an html element, using innerHTML

• writing into the browser console, using console.log()

JavaScript Syntax

JavaScript is case sensitive.

The JavaScript syntax defines two types of values: Fixed values and Variable values.

Fixed values are called literals. Variable values are called variables.

• Literals : number, string
• Varisble : use the var keyward to declare variables

JavaScript Variables

Re-Declaring JavaScript Variables

if you re-declare a javascript variable, it will not lose its value.

the variable carName will still have the value ‘Volvo’ after the execution of these statements

var carName = "Volvo";
var carName;

JavaScript Operators

• typeof : returns the type of a variable
• instanceof : returns true if an object is an instance of an object type

when adding a number and a string, javascript will treat the number as a string.

var x = 16 + "volvo";   => var x = "16" + "volvo";

javascript evaluates expressions from left to right. different swquences can produce different results:

var x = 16 + 4 + "volvo";   => 20volvo
var x = "volvo" + 16 + 4;   => volvo164

var person;   // value is undefined, type is undefined
person = undefined;   // value is undefined, type is undefined

var car = "";     // value is "", the type is string

var person = null;    // value is null, type is object

typeof undefined      // undefined
typeof null           // object
null === undefined    // false
null == undefined     // true

JavaScript Object

Do not declare strings, numbers, and booleans as object

avoid string, number, and boolean objects. they complicate your code and slow down execution speed.

var x = new String();   // declares x as a string object
var y = new number();   // declares y as a number object
var z = new Boolean();  // declares z as a boolean object

JavaScript objects cannot be compared

var x = new String("John");
var y = new String("John");

(x == y) is false because x and y are different objects
(x == x) is true because both are the same object

JavaScript String

• indexOf(), lastIndexOf(), search()

• toUpperCase(), toLowerCase()

• concat() : str1.concat(“ “, str2, str3);

• split(“”) : a string can be converted to an array with the split() method

• extracting string parts 字符串截取

slice(start, [end]) : extracts a part of a string and returns the extracted part in a new string.可以接受参数是负值
substring(start, end) : is similar to slice(). 不能接受参数是负值
substr(strat, length)

charAt(index) : returns the character at a specified index(position) in a string.
charCodeAt(index) : returns the unicode of the character at a specified index in a string.

• replacing string content 字符串替换

replace(str1, str2)str = "please visit microsoft!";

str = "please visit microsoft!";
var n = replace(/microsoft/g, 'ooooooo');

by default, the replace() function replaces only the first match. to replace all matches, use a reqular expression with a g flag.

the replace() method does not change the string it is called on. it returns a new string.

JavaScript Number

use the toString() method to output numbers as base 16(hex), base 8(octal), or base 2(binary).

var myNumber = 128;
myNumber.toString(16);  // returns 80
myNumber.toString(8);  // returns 200
myNumber.toString(2);  // returns 1000000

• infinity

infinity is a number: typeOf infinity returns number

var x = 2 / 0;    // x will be infinity
var y = -2 / 0;   // y will be -infinity
typeof Infinity;  // returns 'number'

• NaN

NaN is a number, and typeof NaN returns number

var x = 100 / 'apple';    // x will be NaN
var x = 100 / '10';       // x will be 10
var x = 100 / 'apple';  isNaN(x);    // returns true
var x = NaN, y = 5; var z = x + y;   // x will be NaN
var x = NaN, y = "5"; var x = x + y; // x will be NaN5
typeof NaN;               // returns 'number'

• toString() : return a number as a string
• valueOf() : retuan a number as a number

• toExponential(number) : return a string, with a number dounded and written using exponential na=otation.

  var x = 9.656;
  x.toExponential(2); // 9.66e+0    参数代表了小数位数
  x.toExponential(4); // 9.6560e+0
  x.toExponential(6); // 9.656000e+0

• toFixed() : return a string, with the number written with a specified number of decimals

  var x = 9.656;
  x.toFixed(0);  // 10
  x.toFixed(2);  // 9.66
  x.toFixed(4);  // 9.6560
  x.toFixed(6);  // 9,656000

• toPrecision() : return a string, with a number written with a specified length

  var x = 9.656;
  x.toPrecision();  // 9.656
  x.toPrecision(2); // 9.7
  x.toPrecision(4); // 9.656
  x.toPrecision(6); // 9.65600

• Number(), paseFloat(), paseInt()

  x = true; Number(x); // 1
  x = false; Number(x); // 0
  pasrInt("10.33");    // 10
  parseFloat("10.33"); // 10.33

JavaScript Scope

• local variable

variables declared within a jacascript function, become locall to the function.
local variables have local scope: they can only be accessed within the function.

• global variable

a variable declared outside a function, becomes global.
a global variable has global scope: all script and function on a web page can access it.

• automatically global

myFunction();

// code here can use carName

function myFunction() {
  carName = "volvo";
}

• global variables in html

with javascript, the global scope is the complete javascript environment.
in html, the global scope is the window object. all global variables belong to the window object.

var carName = "Volvo";

// code here can use window.carName