【JS】刷题之扎实基础方可造大楼

前言: 

        标题为个人理解的题目考点,字体颜色差异,个人认为重点

 

1.throw 规则

function greeting(){
    throw "hello word";
}
function sayHi(){
    try{
        const data = greeting();
        console.log("It worked",data);
    }catch(e){
        console.log("Oh no an error:",e);
    }
}

sayHi()//Oh no an error: hello word;

通过 throw 语句可以创建自定义错误 通过throw可以抛出一个异常,异常可以是数字,字符串,布尔,对象.

通过catch语句,我们可以设定当try语句中抛出异常后应该处理的函数,e为抛出异常返回的值,这里是一个字符串

2.promise   async/await

    const myPromise = () => Promise.resolve ("I have resolved");

    function firstFun() {
        myPromise ().then (res => {
            console.log (res);
        })
        console.log ("second")
    }

    async function secondFun() {
        console.log (await myPromise ())
        console.log ("second")
    }

    firstFun ();//second , "I have resolved"
    secondFun ()//"I have resolved", second

 通俗理解promise :当我们想要调用某个方法,但是由于它可能需要一段时间,因此,会被放在一边,只有当某个值被resolved/rejected,并且执行栈为空时才使用这个值.

我们可以在async函数中通过.them和await关键字获得该值,尽管我们通过.them和await获得promise的价值,但是他们的工作方式有所不同

在firstFun中,当运行到myPromise方法时我们将其放在一边,即promise进入微任务队列,其他后面的代码(console.log("second"))照常执行,执行栈中宏任务队列被清空,此时开始执行微任务队列中的任务,I have resolved 输出,

在secondFun方法中,通过await关键字,暂时停了后面代码的执行,直到异步函数被解析才开始后面代码的执行.这以为这,它会等着知道myPromise以 I have resolved 被解决之后,下一行second 才开始执行

    async function getData() {
        return await Promise.resolve ("YangMing");
    }

    const data = getData ();
    console.log (data); // Promise{<pending>}

    data.then (res => {
        console.log (res) //YangMing
    })

异步函数始终返回一个promise .await 仍然需要等到promise的解决, 当调用getData()并将其赋值给data.

此时data为getData方法返回的一个挂起的promise,(状态为peding),该promise并没有解决,

如果想要访问已解决的值,需要.then()的方法    

 

3.同名全局数据与形参赋值及作用域问题

    (() => {
        let x, y;
        try {
            throw new Error ();
        } catch (x) {
            x = 1, y = 2;
            console.log (x); 
        }
        console.log (x)
        console.log (y)
        // 1 undefined  2
    }) ()

抛出错误后catch的x是一个形参,x赋值为1,但是外层的x没有被赋值,y被赋值为2   所以得出结果为1, undefined ,2

4.Proxy规则

    const handler = {
        set: () => {
            console.log ("added a new Proxy");
        },
        get: () => {
            console.log ("Accessed a property");
        }
    }
    const person = new Proxy ({}, handler);

    person.name = "YangMinG"; //console.log ("added a new Proxy");
    person.name; //console.log ("Accessed a property");
    

使用Proxy对象,我们可以传递一个对象,添加自定义行为.在这个case中,我们传递一个包含以下get,set的对象,

每当被赋值时调用set,每当被获取时调用get

5.sessionStorage规则

关闭选项卡后,将删除存储在sessionStorage中的数据,如果使用localStorage,数据将永久存储,除非调用localStorage.clear()

6.Number.isNaN ,isNaN  Symbol

const name = "Yang Ming";
const age = 27;

//false; 不等价于NaN  为false;
console.log (Number.isNaN (name)) 

//false  不等价于NaN  为false;
console.log (Number.isNaN (age))  

//true   不是一个number 为true
console.log (isNaN (name))

//false  为一个number true        
console.log (isNaN (age))  

//true    
console.log (Number(2)===Number(2)) 

//false  每一个Symbol都是完全唯一的
console.log (Symbol("yangMing") === Symbol("yangMing"))

通过方法Number.isNaN,属于检测传递的值是否等价于NaN.

通过isNaN,属于检测传递的值是否为一个number; 

7.Object.defineProperty规则

        const person = {name: "YangMing"};
        Object.defineProperty (person, "age", {
            value: 27
        })

        console.log (person); //{name:"YangMing",age:27}
        console.log (Object.keys (person)); //["name"]

通过 defineProperty 方法,可以对对象添加,修改,但是添加新属性后,属性默认为不可枚举(not enumerable) 

Object.keys(object)方法只返回对象中可枚举(enumerable)的属性 

8.构造函数

    function Student() {
        this.name = "liYou";
        this.sayHi = function () {
            console.log ("hello" + this.name);
        }
        return {
            make: "yangMing"
        }
    }
    const yangMing = new Student ();
    console.log (yangMing.name);//yangMing
    yangMing.sayHi ();//TypeError: yangMing.sayHi is not a function

当返回属性时,属性的值等于返回的值,而不是构造函数中设定的值,题目中myCar.make为yangMing,

myCar没有返回sayHi 所以输出类型错误

9.use strict

    function getAge() {
        "use strict";
        age = 27;

        //var age ; 1 
        //let age ; 2 
        //const age;3
        console.log (age);
    }

    getAge ();//ReferenceError

使用use strict 可以确保不会意外的生命全局变量,

如果放开1注释,使用var定义age 会生命提前,能输出27

如果放开2注释,使用let 定义age 在初始化之前无法访问变量 ReferenceError

如果放开3注释,const初始化必须赋值 SyntaxError