手记
下载APP

2018前端面试总结js部分【中】

定义函数的方法

1.         语法:function 函数名(参数1[,参数2]……){          函数体;          [return];   //返回值         }         function fx() {                      }                  function () {                      }  //匿名函数 2.字面量          var fn=function(){                  }          3.通过函数对象方式         var x=new function () {                          }

函数的调用

  • 这里的this指向window

//1、函数名();      function getSum() {         console.log(this) //window      }      getSum()       //2、自调用(function(){})()                  (function() {         console.log(this) //window      })();       //3、变量名()           var getSum=function() {         console.log(this) //window      };      getSum()

创建实例的方法

//1.json方法          let obj={         name:"张山",         age:"11",         call:function(){             alert(1)         }     };     obj.call();      //2.构造函数方法     function Obj(){      this.name = "张三",      this.sex = "男",      this.phone = 17603514842,      this.call = function(){      alert(1);      }      }      let obj = new Obj();      obj.call();          //3.object方法      var obj = new Object();      obj.name = "张三";      obj.sex = "男";      obj.call = function(){      alert(this.name);      };      obj.call();

JavaScript的数据类型

  • string number boolean null underfind object typeof (7种)

什么是闭包,闭包有什么缺点 什么情况下用闭包

  • 闭包就是函数嵌套函数,可以理解为定义在函数内部的函数,本质上闭包是函数内部和外部连接的桥梁,但如果父函数定义的变量没有被子函数引用就不叫闭包

  • 闭包让函数的变量都保存在内存中,内存消耗变大。使用不当会造成内存泄漏。

  • 用途:读取函数内部变量  让变量保存到内存中 设置私有变量和方法

函数重载 以及解析顺序

        var m= 1, j = k = 0;          function add(n) {              return n = n+1;        } ;         y = add(m);          function add(n) {              return n = n + 3;          } ;     z = add(m);
  • 以上代码都会输出4,js中没有函数重载的概念,由于定义了连个相同的函数,所以后面的会覆盖前面的
    所以调用add结果都是一样的因此真正到执行代码的时候,也就是第一次调用add(),输出的当然是4,第二次执行add()同样输出4.

js函数调用时加括号和不加括号的区别.不加括号相当于把函数代码赋给等号左边,加括号是把函数返回值赋给等号左边

    var color='green';     var text={         color:'blue',         getColor:function() {           var color='red';           alert(this.color)         }     };     var getColor=text.getColor;     getColor();     text.getColor();     //结果为 green blue

关于this指针

  • 直接调用的话 this指向window对象(这里如果在函数内部声明一个name也指向的window对象)

        var name='张三';    function sayname() {      console.log(this.name)    };    sayname();
  • 对象函数调用 this指向对象本身

    var name='Bob';     function sayName(){         console.log(this.name);     };     var object={'name':'vicky'};     object.sayName=sayName;          //sayName没有写成sayName(),表示不是执行函数,而是将sayName的指针赋值给object.sayName     object.sayName();               //由于对象函数调用方法,this指向对象本身,所以输出:'vicky'     sayName();                     //由于全局环境调用sayName()等同于window.sayName();输出:'Bob'
  • 构造函数调用 this指针指向新创建的对象

    function object(name){         this.name=name;         console.log(this);      //由于this指向新创建的对象本身,输出:Object { name: "vikcy" }         console.log(this.name);  //输出:"vicky"     }     var myObject=new Object('vicky');  //由于this指向新创建的对象本身

JavaScript原型 原型链

  • 每个对象都会在其内部初始化一个属性,就是prototype(原型),当我们访问一个对象的属性时,
    如果这个对象内部不存在这个属性,那么他就会去prototype里找这个属性,这个prototype又会有自己的prototype,
    于是就这样一直找下去,也就是我们平时所说的原型链的概念。

JavaScript有几种类型的值?

  • 栈:原始数据类型(Undefined,Null,Boolean,Number、String)

  • 堆:引用数据类型(对象、数组和函数) 两种类型的区别是:存储位置不同; 原始数据类型直接存储在栈(stack)中的简单数据段,占据空间小、大小固定,属于被频繁使用数据,所以放入栈中存储; 引用数据类型存储在堆(heap)中的对象,占据空间大、大小不固定。如果存储在栈中,将会影响程序运行的性能;引用数
    据类型在栈中存储了指针,该指针指向堆中该实体的起始地址。当解释器寻找引用值时,会首先检索其在栈中的地址,取
    得地址后从堆中获得实体

任何对象转为布尔值,都为得到 true(切记!在JS中,只有 0,-0,NaN,"",null,undefined 这六个值转布尔值时,结果为 false)

        var x = new Boolean(false);    if (x) {      alert('hi');    }    var y = Boolean(0);    if (y) {      alert('hello');     }        //结果只会显示 hi

变量提升

  • 在某作用域,声明变量语句会默认解析为在该作用域的最开始就声明了。

    var a=5;     function foo() {       a=2;       console.log(a);       var a;     }     foo();     //结果会输出2
  • 我们可以看到,var a;语句并没有刷新a的值,因为解析编译的时候,’var a;’被提前了.所以我们看的a是内部变量a而不是外面已赋值的5。

  var a=5;   function foo() {     console.log(a);     var a=1;   }   foo();   //结果输出underfind
  • 由于变量提升的原因a已经声明,所以没有输出我们再外部声明的5,但是a=1;并没有被提前执行.所以变量提升这个概念,只适用于声明变量的
    语句,而变量赋值的语句并不能被提前

    foo();     function foo(){         console.log(1);     }     //TypeError: foo is not a function
  • 这里的foo被提升了,所以这里并没有发生ReferenceError,但是这个时候foo并没有被赋值,所以发生了TypeError。这段代码经过提升后是这样的:

    var foo;     foo();     foo=function fooo() {       console.log(1)     }
  • 我们习惯将‘var a=5’看做一条声明。其实这里两条语句的简写,‘var a’和‘a = 3’,并且其实这两条语句是两个不同类型的语句,是由两个不同
    的组件完成的。前一句是在编译阶段执行,后一句是在运行阶段执行。所以,不管’var a’写在哪里,都会在代码本身被执行之前处理。这一过程很像
    是代码的一个移动过程,所以被大家称为“变量提升”。

浏览器从输入url到加载完成 都发生了什么

1、浏览器地址栏输入url

2、浏览器会先查看浏览器缓存--系统缓存--路由缓存,如有存在缓存,就直接显示。如果没有,接着第三步

3、域名解析(DNS)获取相应的ip

4、浏览器向服务器发起tcp连接,与浏览器建立tcp三次握手

5、握手成功,浏览器向服务器发送http请求,请求数据包

6、服务器请求数据,将数据返回到浏览器

7、浏览器接收响应,读取页面内容,解析html源码,生成DOM树

8、解析css样式、浏览器渲染,js交互

常见的浏览器内核

谷歌:-webkit- 火狐:-moz- ie:-ms- 欧鹏:-o- qq浏览器:双内核 -webkit- -ms-

节点操作

  • 创建节点
        createDocumentFragment() //创建一个DOM片段
       createElement() //创建一个具体的元素
       createTextNode() //创建一个文本节点

  • 添加、移除、替换、插入
    appendChild() //添加
      removeChild() //移除
      replaceChild() //替换
      insertBefore() //插入

  • 查找
    getElementsByTagName() //通过标签名称
      getElementsByName() //通过元素的Name属性的值
      getElementById() //通过元素Id,唯一性

作用域

  • 每个函数都有一个作用域,比如我们创建了一个函数,函数里面又包含了一个函数,那么现在就有三个作用域,这样就形参了一个作用域链

  • 特点: 先在自己的变量范围中查找,如果找不到,就会沿着作用域链网上找。


作者:陇锦
链接:https://juejin.im/post/5b2f4eb9e51d4558cc35c289
来源:掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
打开App,阅读手记
0人推荐
随时随地看视频慕课网APP