JS生疏知识点整理

2018-04-25  本文已影响7人  Sekale

const ：

定义变量不可更改；

定义对象可更改、扩展、删除对象属性值，仅仅能做到不可更改引用（重新赋值）而已。

  实现常量对象：不可更改、扩展、删除属性值。

  1.不可扩展：  Object.preventExtensions(Obj)；

  2.1+不可删除：  Object.seal(Obj)；

  3.1+2+不可更改：   Object.freeze(Obj)；

作用域、作用域链与闭包：

作用域：在 JavaScript 中，作用域为可访问变量、函数与对象的集合。

由于函数是静态作用域 ，函数的作用域在函数定义时就已经决定了。

作用域链：根据子函数可以访问父函数变量的机制，利用链式查找，找出子函数能访问的变量、函数与对象的集合。

闭包：父函数销毁后，子函数能访问的外部变量仍然保存在内存中。

Exp.1 不符合期望的输出

function outer(){  //外部函数
    var r = new Array();
    for (var i=0; i<2; i++){
        r[i] = function() { //内部函数
            console.log(i);
        }
    }
    return r;
}
var fn = outer();
fn[0](); //打印2而不是0
fn[1](); //打印2而不是1

原因为：变量 i 是 fn 函数数组的共同父函数中的变量，在父函数执行完毕后，i 的值已被修改为2，然后再被打印出来。

改进1：符合期望的输出

function outer(){
    var r = new Array();
    for (var i=0; i<2; i++){
        function inner(i) { //内部函数
            return function(){
                console.log(i);
            }
        }
        r[i] = inner(i);
    }
    return r;
}
var fn = outer();
fn[0](); //打印0
fn[1](); //打印1

原因为：函数 inner 中的 i 是其局部变量，fn 函数数组分别执行时，调用的是自己的局部变量 i，该值是在 outer 运行生成 r[i] 时就已经保存好的。
实际上 inner 中的 i 换成任何变量名都可顺利运行，这里这么设置更加 trick。

改进2：符合期望的输出

function outer(){  //外部函数
    var r = new Array();
    for (let i=0; i<2; i++){
        r[i] = function() { //内部函数
            console.log(i);
        }
    }
    return r;
}
var fn = outer();
fn[0](); //打印0
fn[1](); //打印1

原因：将源代码声明 i 的 var 改成了 let。

let 允许你声明一个作用域被限制在块级中的变量、语句或者表达式。let 声明的变量只在其声明的块或子块中可用，而 var 声明的变量的作用域是声明它的封闭函数中。

事件循环

含义：因为 js 是单线程运行的，所以异步操作会交给浏览器别的模块来处理，处理完后回调函数会放入任务队列中，等待调用栈清空后再执行该队列。

在程序运行过程中，js 会一直执行轮询任务队列。

参考深入浅出JavaScript事件循环机制(下)，事件队列也是有分类的:

macro-task（宏任务）包括：script(整体代码)，setTimeout，setInterval，setImmediate，I/O，UI rendering。

micro-task（微任务）包括：process.nextTick，Promises，Object.observe，MutationObserver。

执行顺序是先执行调用栈，再执行微任务，再执行宏任务，然后再回去轮询微任务，一直这么循环。

应用1：setTimeout()

for(var i=0;i<99;i++){
    setTimeout(function(){
        console.log("two");
    },0);
    console.log("one");
}

该程序运行结果为先输出99个“one”，再把99个“two”全部输出。因为调用栈总是最先执行。

应用2：Promise

setTimeout(function(){ console.log(5);},0);
new Promise (function(resolve){
    console.log(1);
    resolve();
}).then(function(){
    console.log(3);
}).then(function(){
    console.log(4);
});
console.log(2);

该程序输出 1 2 3 4 5。

JS常用对象及其主要方法与属性

1. Number

Number的方法与属性

2. String

String的主要方法

3. Array

Array主要方法

  上表输出结果格式为：原始a->函数返回值->结果a。

4. Boolean

5. Math

（面试的时候让我写有什么方法，真的一脸懵逼，从来不用，于是一个都没写出来）

6. Date

上一篇下一篇

猜你喜欢

热点阅读