JavaScript 基础

发表于 | 更新于 | 分类于 | 评论数： | 阅读次数：

JavaScript 基础语法介绍，基于 ES6。

必须启用严格模式

1
2
3
'use strict'

// code

数据类型(6 种)

  • Number

  • String

  • Boolean

  • Array

  • null

  • undefined

  • Object 包含 function Date Array

1
let x = new Number;

类型转换

1
2
3
String(123);

(123).toString()

类型检测

1
2
3
4
5
6
7
8
9
typeof 100 // number

obj instanceof Object // obj 是不是 Object

Object.prototype.toString.apply([]); // [object Array]

// constructor

// duck type

隐式转换

1
2
3
"37" - 7 // 30

"37" + 7 // 377

基础语法

  • 一行或多行 字符串和变量写在一起
1
2
3
4
`your name is ${name}`

`h
ello JS`

  • 常量 const PI=3.14; // 同 PHP

  • 变量 let a; a = 1 a = 'Hello World !'

let const 严禁使用 var

  • 特例 var a = (1,2,3); // 取右边的数值 a = 3

  • 连接符 +

  • 换行

1
2
document.write("hello \
World !")

调试

1
2
3
let x = 15 * 5;
debugger;
document.getElementbyId("demo").innerHTML = x;

变量提升

1
2
3
4
5
6
7
8
9
a = 1;

console.log(a); // 可以正常输出

console.log(b); // 报错

var a;

var b = 1; // 声明的同时赋值，变量不会提升

变量作用域

函数外部声明，函数内部可以调用，反之不行。

特例：如果变量在函数内没有声明（即，没有使用 var 关键字），该变量为全局变量

1
2
3
4
5
6
// 此处可调用 carName 变量

function myFunction() {
    carName = "Volvo";
    // 此处可调用 carName 变量
}

函数

1
2
3
4
5
6
7
8
function fun1(a, b = 3) { // ES6 才允许函数默认值
  console.log(a);
  console.log(b);
  argument[0];     // 包含函数参数的数组
  return a;        // 函数返回值
}

fun1(1, 2);  // 调用函数

在函数表达式存储在变量后，变量也可作为一个函数使用：

1
2
let x = function (a, b) {return a * b};
let z = x(4, 3);

函数参数

可变参数 ES6 同 PHP

1
2
3
4
5
function f(...a){
  // 遍历 a
}

f(1,2,3,4);

自调用函数

1
2
3
(function () {
    let x = "Hello!!";      // 我将调用自己
})();

闭包

1
2


高阶函数

一个函数接收另一个函数作为参数，这种函数就称之为高阶函数

箭头函数

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
x => x * x

function (x) {
    return x * x;
}

x => {
    if (x > 0) {
        return x * x;
    }
    else {
        return - x * x;
    }
}

// 两个参数:
(x, y) => x * x + y * y

// 无参数:
() => 3.14

// 可变参数:
(x, y, ...rest) => {
    var i, sum = x + y;
    for (i=0; i<rest.length; i++) {
        sum += rest[i];
    }
    return sum;
}

包装对象

1
2
3
let a = 'a';

let obj = new String('a');

数组

1
2
3
4
5
6
7
8
9
10
11
let myArray = new Array();

let myArray = new Array(1,2,3);

let myArray = [1,2,3]; // 同 PHP

myArray[0] = 80;  // 数组赋值

myArray.length;  // 数组长度

myArray.sort()   // 数组排序

数组合并

1
2
3
let a = [1, 2, 3];

let b = ['hello', ...a];

流程控制

if while 同 PHP break continue

1
2
3
4
5
6
7
switch (expression) {
  case expression: // 这里是恒等 ===

    break;
  default:

}
1
2
3
for (let i = 0; i < array.length; i++) {
  array[i]
}
1
2
3
4
5
for (let variable in object) {
  if (object.hasOwnProperty(variable)) {

  }
}
1
2
3
do {

} while (true);

错误处理

1
2
3
4
5
6
7
try {
  throw "test"
} catch (e) {
  console.log(e);
} finally {
  console.log('finally');
}

严格模式 'use strict'

提供更强的错误检查。

1
2
3
function functionName() {
  'use strict'
}

不允许用 with

delete 参数、函数名会报错

对象字面量重复属性报错 {x:1,x:2}

等等。

0%