1 数据类型
1.1 数据类型列表
字符串、数字、布尔、数组、对象、Null、Undefined
1.2 true or false
1.2.1 == 与 ===
== 相等运算，如果比较对象类型不同，JavaScript 会先将比较对象转化成相同类型再做比较。
=== 严格相等运算，比较对象类型和数值都相同是才返回true。
console.log("" == false); // true
console.log(" " == false); // true
console.log("1" == true); // true
console.log(0 == false); // true
console.log(1 == true); // true
console.log((1 == "1")); // true
console.log((1 === "1")); // false
console.log((null == undefined)); // true
console.log((NaN == NaN)); // false
1.2.2JavaScript中的5个假值：
undefined,
null,
0,
空字符串（如"", " ", " "）
NaN
2 函数
2.1 声明函数 与 函数表达式 的区别
log1("log1 start");
log2("log2 start"); // Uncaught TypeError: log2 is not a function
// 函数声明
function log1(message) {
console.log(message);
}
// 函数表达式
var log2 = function (message) {
console.log(message);
};
log1("log1 end");
log2("log2 end");
调用时机的差异
声明函数 可以声明前调用，而函数表达式不行。
上面的代码log2("log2 start");那一行会报错：Uncaught TypeError: log2 is not a function。
原因：
浏览器分两遍读取网页： 第一遍读取所有的函数定义，第二遍开始执行代码。
声明函数会在第一遍时被加载，而函数表达式要等到第二次才会被加载。在浏览器第二遍从上往下执行代码的时候log2("log2 start");比var log2 = function (message) {执行得早，所以log2在调用的时候还没赋值，于是报错。
2.2 闭包
闭包 = 有 自由变量 的 函数
function makeCounter() {
var count = 0; // 自由变量
function counter() {
count = count + 1;
return count;
}
return counter; // 这是一个闭包，在其环境中存储了变量count
}
var counter1 = makeCounter();
var counter2 = makeCounter(); // 每个counter都有各自的计数变量count，互不干扰
console.log(counter1()); // 1
console.log(counter1()); // 2
console.log(counter1()); // 3
console.log(counter2()); // 1
console.log(counter2()); // 2
console.log(counter2()); // 3
3 对象
3.1 对象的创建与使用
var tom = {
id: 1,
name: "tom",
age: 2,
say: function (message) {
console.log(this.name + " say: " + message);
}
};
tom.say("hello");
tom.father = "big tom"; // 动态添加属性
console.log(tom.father); //big tom
delete tom.father; // 动态删除属性
console.log(tom.father); //undefined
3.2 构造方法
function People(name, age) {
this.name = name;
this.age = age;
this.say = function (message) {
console.log(this.name + " [age:" + age + "] say: " + message);
}
}
// new 对象方式1
var jack = new People("jack", 1); // 注意构造方法前面要加 new
jack.say("hello");
// new 对象方式2
var mikeParams = {
name: "Mike",
age: 20
};
var mike = new People(mikeParams);
mike.say("Hi");
3.3 原型
通过原型（prototype）可以给类的所有实例对象的同时添加属性。
当单个实例修改prototype属性时，不影响其他实例对象的prototype的值。
People.prototype.gender = "man";
console.log(jack.gender); // man
console.log(mike.gender); //man
jack.gender = "woman";
console.log(jack.gender); // woman
console.log(mike.gender); // man
4 事件
网页加载完毕后方能通过getElementById获取到DOM对象，而网页加载完毕的事件是window.onload
window.onload = init;
function init() {
console.log("init");
}
5 HTML文件结构
image.png
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
function log(message) {
console.log(message)
}
</script>
</head>
<body>
<button onclick="log('hello js')">click me</button>
</body>
</html>
网友评论