JavaScript 学习笔记

基础部分

Js 严格区分大小写
Js 不区分整数和浮点数，统一用 Number 表示
== 自动转换数据类型再比较，**===** 不会转换数据类型，应始终坚持用 === 比较
NaN 非数字值 (Not a Number) 检测使用 isNaN() 函数
null 和 undefined 基本同义，大多数情况下都应该用 null，null 表示”没有对象”，即此处不应该有值，undefined 表示”缺少值”，就是此处应该有一个值，但是还没有定义，详见阮一峰
数组用 [ ] 表示，也可以用 Array() 函数实现，使用索引访问

JS 对象，键是字符串类型，值任意类型

var person = {
    name:'Bob',
    age:20
};

判断一个对象的属性是否存在(含继承) in，(不含继承) hasOwnProperty()
strict 模式会强制 var 关键字申明变量，详见阮一峰
多行字符串，使用 \n 转义，最新 ES6 可以使用反引号 ···
字符串连接，使用 **+**，最新 ES6 可以使用 **${变量名}**，必须使用反引号
判断条件，JavaScript把 null、undefined、0、NaN、’ ‘ 视为 false，其他值一概视为 true
循环输出，for…in 输出对象的所有属性，输出数组的索引
循环输出，for···of 输出数组的值 ES6

ES6 中新增的数据类型 Map、Set，以及 iterable ，Set 只存储键，键不能重复，Map、Set、Array 均属于 iterable 类型，均可通过 forEach() 遍历

var m = new Map([
    ['Michael', 95],
    ['Bob', 75],
    ['Tracy', 85]
]);
m.set('Adam', 67); //添加新元素
m.get('Bob'); //获取元素
m.has('Bob'); //判断存在
m.delete('Bob'); //删除元素

var a = [1,2,3];
a.forEach(function (element, index, array) {
    // element:指向当前元素的值
    // index:指向当前索引
    // array:指向 Array 对象本身
});
var b = new Set(['A', 'B', 'C']);
b.forEach(function (element, sameElement, set) {
    // 前两个参数均为当前元素
    // set:指向当前 Set
});
var c = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
c.forEach(function (value, key, map) {
    // value: 指向当前元素的值
    // key: 指向当前元素的键
    // map: 指向当前 Map
});

函数内部关键字 arguments，永远指向当前函数的调用者传入的所有参数
变量提升，JavaScript 的函数定义特点，先扫描整个函数体的语句，把所有申明的变量“提升”到函数顶部
var和let，let 声明块级作用域，const 声明常量

高阶函数 map()、reduce()

var pow = function (x) {
    return x*x;
}
var arr = [1,2,3,4];
var arr2 = arr.map(pow);

var arr = [1,2,3,4,5];
var b = arr.reduce(function (x, y) {
    return x + y;
});
alert(b); //返回 15

filter() 接收一个函数，将函数作用于 Array 中的每一个元素，根据返回值是 true 或 false，来决定是否保留该元素
1
2
3
4
5
var arr = [1,2,3,4,5];
var b = arr.filter(function (x) {
return x % 2 == 0;
});
alert(b); //返回 2,4

闭包，函数作为返回值，并且相关参数和变量都保存在返回的函数中；使用闭包时，返回函数不要引用任何循环变量，或者后续会发生变化的变量，如若使用，须创建一个函数，用该函数的参数绑定循环变量当前的值

function count() {
    var arr = [];
    for (var i=1; i<=3; i++) {
        arr.push(function () {
            return i*i;
        });
    }
    return arr;
}
var results = count();
var f1 = results[0];  
var f2 = results[1];
var f3 = results[2];
f1(); // 16
f2(); // 16
f3(); // 16

function count() {
    var arr = [];
    for (var i=1; i<=3; i++) {
        arr.push((function (n) {
            return function () {
                return n * n;
            }
        })(i));
    }
    return arr;
}
var results = count();
var f1 = results[0];
var f2 = results[1];
var f3 = results[2];
f1(); // 1
f2(); // 4
f3(); // 9

创建一个匿名函数并立刻执行

1
2
3

(function (x) {
    return x * x;
})(3); //9

箭头函数完全修复了函数内部使用 this 关键字的指向问题

关于包装对象

1. 不要使用new Number()、new Boolean()、new String()创建包装对象
2. 用parseInt()或parseFloat()来转换任意类型到number
3. 用String()来转换任意类型到string，或者直接调用某个对象的toString()方法
4. 通常不必把任意类型转换为boolean再判断，因为可以直接写if (myVar) {...}
5. typeof操作符可以判断出number、boolean、string、function和undefined
6. 判断Array要使用Array.isArray(arr)
7. 判断null请使用myVar === null
8. 判断某个全局变量是否存在用typeof window.myVar === 'undefined'
9. 函数内部判断某个变量是否存在用typeof myVar === 'undefined'

面向对象编程，原型链，JavaScipt 的原型链和 Java 的 Class 的区别就在，它没有 “Class” 的概念，所有的对象都是实例，所谓继承关系不过是把一个对象的原型指向另一个对象而已

var Student = { // 原型对象
    name: 'Robot',
    height: 1.8,
    run: function () {
        console.log(this.name + ' is running...');
    }
};
function createStudent (name) {
    // 基于 Student 原型创建一个新对象
    var s = Object.create(Student);
    // 初始化新对象
    s.name = name;
    return s;
}
var xiaoming = createStudent('小明');