• JS(四)


    ● setTimeout、setInterval和requestAnimationFrame之间的区别

    这里有一篇文章讲的是requestAnimationFrame:http://www.cnblogs.com/xiaohuochai/p/5777186.html

    ● 用setTimeout来实现setInterval

    (1)用setTimeout()方法来模拟setInterval()与setInterval()之间的什么区别?
    首先来看setInterval的缺陷,使用setInterval()创建的定时器确保了定时器代码规则地插入队列中。这个问题在于:如果定时器代码在代码再次添加到队列之前还没完成执行,结果就会导致定时器代码连续运行好几次。而之间没有间隔。不过幸运的是:javascript引擎足够聪明,能够避免这个问题。当且仅当没有该定时器的如何代码实例时,才会将定时器代码添加到队列中。这确保了定时器代码加入队列中最小的时间间隔为指定时间。

    这种重复定时器的规则有两个问题:1.某些间隔会被跳过 2.多个定时器的代码执行时间可能会比预期小。

    ● js怎么控制一次加载一张图片,加载完后再加载下一张

    在这里插入图片描述
    2.
    在这里插入图片描述

    ● 代码的执行顺序

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

    //输出2,6,5,3,4,1
    为什么呢?具体请参考文章:
    从promise、process.nextTick、setTimeout出发,谈谈Event Loop中的Job queue

    ● 如何实现sleep的效果(es5或者es6)

    (1)while循环的方式

    function sleep(ms){
    var start=Date.now(),expire=start+ms;
    while(Date.now()<expire);
    console.log('1111');
    return;
    }
    

    执行sleep(1000)之后,休眠了1000ms之后输出了1111。上述循环的方式缺点很明显,容易造成死循环。

    (2)通过promise来实现

    function sleep(ms){
    var temple=new Promise(
    (resolve)=>{
    console.log(111);setTimeout(resolve,ms)
    });
    return temple
    }
    sleep(500).then(function(){
    //console.log(222)
    })
    
    

    //先输出了111,延迟500ms后输出222

    ● 简单的实现一个promise

    https://github.com/forthealllight/blog/issues/4

    ● Function.proto(getPrototypeOf)是什么?

    获取一个对象的原型,在chrome中可以通过_proto_的形式,或者在ES6中可以通过Object.getPrototypeOf的形式。
    那么Function.proto是什么么?也就是说Function由什么对象继承而来,我们来做如下判别。

    Function.proto==Object.prototype //false

    Function.proto==Function.prototype//true

    我们发现Function的原型也是Function。

    我们用图可以来明确这个关系:

    2018-07-10 2 38 27

    ● 实现js中所有对象的深度克隆(包装对象,Date对象,正则对象)

    通过递归可以简单实现对象的深度克隆,但是这种方法不管是ES6还是ES5实现,都有同样的缺陷,就是只能实现特定的object的深度复制(比如数组和函数),不能实现包装对象Number,String , Boolean,以及Date对象,RegExp对象的复制。

    valueof()函数

    对于原始值或者包装类:

    function baseClone(base){
    return base.valueOf();
    }
    //Number
    var num=new Number(1);
    var newNum=baseClone(num);
    //newNum->1
    //String
    var str=new String('hello');
    var newStr=baseClone(str);
    // newStr->"hello"
    //Boolean
    var bol=new Boolean(true);
    var newBol=baseClone(bol);
    //newBol-> true
    

    其实对于包装类,完全可以用=号来进行克隆,其实没有深度克隆一说,

    这里用valueOf实现,语法上比较符合规范。

    对于Date类型:

    因为valueOf方法,日期类定义的valueOf()方法会返回它的一个内部表示:1970年1月1日以来的毫秒数.因此我们可以在Date的原型上定义克隆的方法:

    Date.prototype.clone=function(){
    return new Date(this.valueOf());
    }
    var date=new Date('2010');
    var newDate=date.clone();
    // newDate->  Fri Jan 01 2010 08:00:00 GMT+0800
    
    

    对于正则对象RegExp:

    RegExp.prototype.clone = function() {
    var pattern = this.valueOf();
    var flags = '';
    flags += pattern.global ? 'g' : '';
    flags += pattern.ignoreCase ? 'i' : '';
    flags += pattern.multiline ? 'm' : '';
    return new RegExp(pattern.source, flags);
    };
    var reg=new RegExp('/111/');
    var newReg=reg.clone();
    //newReg->  //111//
    
    

    ● 箭头函数中this指向举例

    var a=11;
    function test2(){
    this.a=22;
    let b=()=>{console.log(this.a)} // 22
    b();
    }
    var x=new test2();
    
  • 相关阅读:
    十:Webpack 引入bootstrap
    九:Webpack结合ES6
    pfx格式密钥库修改密码
    邮件发送接收工具
    用keytool制作证书并在tomcat配置https服务(四)
    用keytool制作证书并在tomcat配置https服务(三)
    用keytool制作证书并在tomcat配置https服务(二 )
    用keytool制作证书并在tomcat配置https服务(一)
    java全角和半角转换
    RC4加密解密
  • 原文地址:https://www.cnblogs.com/jackson1/p/13836558.html
Copyright © 2020-2023  润新知