js基础查漏补缺(更新)

js基础查漏补缺:

  1. NaN != NaN;
    复制数组可以用slice;
    数组的sort、reverse等方法都会改变自身;
    Map是一组键值对的结构,Set是key的集合;
    Array、Map、Set都属于iterable类型,可用for...of遍历;
    !!是将变量转为布尔类型的方法;    
    0.1+0.2!==0.3(计算机中用二进制来存储小数,而大部分小数转成二进制之后都是无限循环的值,因此存在取舍问题,导致精度丢失);

  2. rest参数只能写在最后,前面用...标识;
     一个函数接收另一个函数作为参数称之为高阶函数,比如map、reduce、filter、sort;
    arr.map(String) 将数组元素都变为string类型;
// 数组去重
arr.filter(function(element, index, self) {
    return self.indexOf(element) === index;
})

// 筛选素数
arr.filter(function(num){
    var flag = true;
    if(num < 2){
        flag = false;
    }else{
        for(var i=2; i<num; i++){
            if(num % i == 0){
                flag = false;
                break;
            } 
        }
    }
    return flag;
})

      返回闭包时尽量不要引用任何循环变量,或者后续会发生变化的变量,如果非要,可以用该函数的参数绑定值自执行;

      借助闭包可以封装私有变量,携带状态,可以把多参数函数变成单参数;

      由于this在箭头函数中已经按词法作用域绑定了,所以call和apply调用箭头函数时无法对this绑定,会忽略;

      generator函数可以在执行过程中多次返回,看上去就像可以记住执行状态的函数,可以用for...of循环循环generator对象;

  3. typeof NaN === 'number'          typeof null === 'object'

      尽量不要使用new String等去创建包装对象;

     1+null === 1      1+undefined === NaN

     123..toString() === '123' 或 (123).toString()

     null,undefined没有toString方法

     正则:\d(数字) \w(字母或数字) \s(空格) *(任意个字符) +(至少一个字符) ?(0或1个字符) {n}(n个字符) {n,m}(n到m个字符)   

     进阶正则:[]表示范围 ^开头 $结尾 ; / / 或 new RegExp() ;

     模版解析:str.replace(/\{(.*?)\}/g, (match, key)=>obj[key.trim()]);

     切分字符串:‘a,b;; c d’.split(/[\s\,\;]+/)

     分组:用()表示要提取的分组,reg.exec(str),返回一个数组,第一个是匹配到的整个字符串,后面的表示匹配成功的子串;失败返回null

      默认贪婪匹配(匹配尽可能多的字符),非贪婪匹配(加上?);

      JSON.stringify第二个参数可以传入一个数组(输出指定的属性),也可传入一个函数(参数为key和value),第三个参数是缩进‘  ’;如果想精确控制序列化,可以给对象定义toJSON方法,直接返回需要的数据;

      JSON.parse反序列化;

      低版本浏览器无__proto__,所以用Object.create();

      Promise的任务会在当前事件循环末尾中执行,而setTimeout中的任务是在下一次事件循环执行;

// new运算符做了什么

function foo(fn, ...rest){
  let obj = Object.create(fn.prototype);
  let val = fn.apply(obj, rest);
  return isPrimitive(val) ? obj : val;
}

function isPrimitive(a){
  let b = typeof a;
  return !! (a===undefined || a===null || b==='boolean' || b==='number' || b==='string');
}

function A(){};
let a = foo(A);

 

  4. location.assign('') location.reload();

      dom树的根节点是document;

      服务器可以根据cookie来区分用户,如果在cookie中设置了HTTPOnly属性,js脚本将无法读取cookie信息,这样能有效防止xss攻击;

      不要使用history对象;

      children是只读的,firstElementChild,lastElementChild,innerText,textContent,appendChild,insertBefore(new, target),removeChild,parentElement;

      h5控件:type为date,datetime-local,color,获取值dom.value;

      ajax:XMLHttpRequest对象,低版本ie用ActiveXObject;

  5. 垃圾回收机制(Garbage Collection):

      标记清除(推荐),分为标记阶段(把所有活动对象做上标记,深度遍历)和清除阶段(销毁非活动对象);

      引用计数,会因为循环引用而无法清除;

  6. requestAnimationFrame告诉浏览器在下次重绘之前调用指定函数来更新动画;一个在每次需要重新绘制动画时调用的包含指定函数的参数。这个回调函数有一个传参,DOMHighResTimeStamp,指示从触发 requestAnimationFrame 回调到现在(重新渲染页面内容之前)的时间(从 performance.now() 取得)。

  7. es6、7大部分新特性的熟练理解和掌握 

  8. 希望2018年继续夯实基础,对每个知识点都有透彻的理解和认识,加油!    

      

      

  

posted @ 2018-01-07 10:50  we are young  阅读(445)  评论(0编辑  收藏  举报