javascript--面试题

(1)javaScript怎么清空数组?

var arrayList = ['a','b','c','d','e','f'];

怎么清空 arrayList

方法1:直接改变arrayList所指向的对象,原对象并不改变。

arrayList = [];

方法2:这种方法通过设置length=0 使原数组清除元素。

arrayList.length = 0;

方法3

arrayList.splice(0, arrayList.length);

(2)怎么判断一个object是否是数组(array)?

方法1:使用 Object.prototype.toString 来判断是否是数组,这里使用call来使 toString 中 this 指向 obj。进而完成判断

function isArray(obj){
    return Object.prototype.toString.call( obj ) === '[object Array]';
}

方法二:使用 原型链 来完成判断,基本思想是利用 实例如果是某个构造函数构造出来的那么 它的 __proto__是指向构造函数的 prototype属性。

function isArray(obj){
    return obj.__proto__ === Array.prototype;
}

方法3:利用JQuery

function isArray(obj){
    return $.isArray(obj)
}

(2)数组去重

function uniq(array){
    var temp = []; //一个新的临时数组
    for(var i = 0; i < array.length; i++){
        if(temp.indexOf(array[i]) == -1){
            temp.push(array[i]);
        }
    }
    return temp;
}

var aa = [1,2,2,4,9,6,7,5,2,3,5,6,5];
console.log(aa)
console.log(uniq(aa))

3、JavaScript如何实现继承?

  • 构造继承
  • 原型继承
  • 实例继承
  • 拷贝继承
  • 原型prototype机制或apply和call方法去实现较简单,建议使用构造函数与原型混合方式
function Parent(){
      this.name = 'wang';
  }

  function Child(){
      this.age = 28;
  }
  Child.prototype = new Parent();//继承了Parent,通过原型
  var demo = new Child();
  alert(demo.age);
  alert(demo.name);//得到被继承的属性

5、例举3种强制类型转换和2种隐式类型转换?

  • 强制(parseInt,parseFloat,number)隐式(== ===)

6、split()join()的区别

  • 前者是切割成数组的形式,后者是将数组转换成字符串

7、数组方法pop()push()unshift()shift()

  • pop()尾部删除 push()尾部添加
  • shift()头部删除 unshift()头部添加

11、ajax请求时,如何解释json数据

  • 使用eval parse,鉴于安全性考虑,使用parse更靠谱

12、事件委托是什么

  • 让利用事件冒泡的原理,让自己的所触发的事件,让他的父元素代替执行!

12(1)请说说事件委托机制?这样做有什么好处?

  • 事件委托,就是某个事件本来该自己干的,但是自己不干,交给别人来干,就叫事件委托。打个比方:一个button对象,本来自己需要监控自身的点击事件,但是自己不来监控这个点击事件,让自己的父节点来监控自己的点击事件。

    好处

  • A,提高性能:例如,当有很多li同时需要注册时间的时候,如果使用传统方法来注册事件的话,需要给每一个li注册事件。然而如果使用委托事件的话,就只需要将事件委托给该一个元素即可。这样就能提高性能
  • B,新添加的元素还会有之前的事件

13、闭包是什么,有什么特性,对页面有什么影响?简要介绍你理解的闭包

  闭包就是能够读取其他函数内部变量的函数

  通俗的讲:就是函数a的内部函数b,被函数a外部的一个变量引用的时候,就创建了一个闭包。

  优点:

  • ① 减少全局变量。
  • ② 减少传递函数的参数量
  • ③ 封装;

  缺点:

  • 使用闭包会占有内存资源,过多的使用闭包会导致内存溢出等.

  

14、添加 插入 替换 移除 到某个接点的方法

  • obj.appendChild()
  • obj.insertBefore()
  • obj.replaceChild()
  • obj.removeChild() 

14(1)、DOM怎样添加、移动、复制、创建和查找节点

  

// 创建新节点
createDocumentFragment()    //创建一个DOM片段
createElement()   //创建一个具体的元素
createTextNode()   //创建一个文本节点
// 添加、移除、替换、插入
appendChild()
removeChild()
replaceChild()
insertBefore() //在已有的子节点前插入一个新的子节点
// 查找
getElementsByTagName()    //通过标签名称
getElementsByName()    //通过元素的Name属性的值(IE容错能力较强,会得到一个数组,其中包括id等于name值的)
getElementById()    //通过元素Id,唯一性

15、"=="和"==="的不同

  • 前者会自动转换类型,后者不会

  ==判断内容是否相等不比较类型

  console.log(1=="1");//true

  ===判断内容相等且类型也相等

  console.log(1==="1"); //false

16、编写一个b继承a的方法、

function A(name){
    this.name = name;
    this.sayHello = function(){alert(this.name+” say Hello!”);};

}
function B(name,id){
    this.temp = A;
    this.temp(name);        //相当于new A();
    delete this.temp;       
     this.id = id;   
    this.checkId = function(ID){alert(this.id==ID)};
}

17、如何阻止事件冒泡和默认事件

function stopBubble(e)
{
    if (e && e.stopPropagation)
        e.stopPropagation()
    else
        window.event.cancelBubble=true
}
return false

17(1)什么是事件冒泡/捕获

事件冒泡:子元素事件的触发会影响父元素事件

  • 开关事件冒泡:
  • A,开启事件冒泡:element.addEventListener(eventName,handler,false);
  • B,关闭事件冒泡:假设传统方式事件的返回值为e,就可以通过e.stopPropagation()来关闭事件冒泡;

事件捕获:父元素的事件会影响子元素的事件;

  • 开启事件捕获:element.addEventListener(eventName,hadler,true)

19、谈谈this对象的理解

  • this是js的一个关键字,随着函数使用场合不同,this的值会发生变化。
  • 但是有一个总原则,那就是this指的是调用函数的那个对象。
  • this一般情况下:是全局对象Global。作为方法调用,那么this就是指这个对象

this对象的理解

  • this是一个关键字,它代表函数运行时,自动生成一个内部对象,只能在函数内部使用
  • 1.作为纯粹的函数调用this指向全局对象
  • 2.作为对象的方法调用this指向调用对象
  • 3.作为构造函数被调用this指向新的对象(new会改变this的指向)
  • 4.apply调用this指向apply方法的第一个参数
  • this总是指向函数的直接调用者(而并非间接调用者);
  • 如果有new关键字,this指向new出来的那个对象;
  • 在事件中,this指向这个事件的对象,特殊的是,IE中的attachEvent中的this总是指向全局对象Window;

24、对于前端自动化构建工具有了解吗?简单介绍一下

  • Gulp,Grunt等

25、说一下什么是JavaScript的同源策略?

  • 一段脚本只能读取来自同一来源的窗口和文档的属性,这里的同一源指的是主机名,协议和端口号的组合

26、eval是指做什么的?

  • 它的功能是把对应的字符串解析成JS代码并运行;
  • 应该避免使用eval,不安全,非常耗性能(2次、一次解析成js语句,一次执行);
  • 由JSON字符串转换为JSON对象的时候可以用eval,val obj=eval('('+str+')')

27.请列举字符串操作的方法?

  • chartCodeAt方法返回一个整数,代表指定位置字符的Unicode编码;
  • chartAt方法返回指定索引位置处的字符。如果超出有效范围的索引值返回空字符串;
  • slice方法返回字符串的片段
  • substring方法返回位于String对象中指定位置的子字符串。
  • substr方法返回一个从指定位置开始的指定长度的子字符串。
  • indexOf方法返回String对象内第一次出现子字符串位置。如果没有找到子字符串。则返回-1;
  • lastIndexOf方法返回String对象中字符串最后出现的位置。如果没有匹配到子字符串,则返回-1;
  • search方法返回与正则表达式查找内容匹配的第一个字符串的位置;
  • concat方法返回字符串值,该值包含了两个或多个提供的字符串的连接;
  • split将一个字符串分割为子字符串,然后将结果作为字符串数组返回;

28、null和undefined的区别?

null是表示"无"的对象,转为数值时为0;undefined是表示"无"的原始值,转为数值时为NaN。

Q1

  • 1、变量被声明了,但没有赋值,就等于undefined。
  • 调用函数时
  • 2,应该提供的参数没有提供该参数等于undefined。
  • 3、对象没有赋值的属性,该属性的值为undefined.
  • 4、函数没有返回值时,默认返回undefined。

    Q2

  • 1、作为函数的参数,表示该函数的参数不是对象
  • 2、作为对象原型链的终点。

29、new操作符具体干了什么呢?

  • 1、创建一个空对象,并且this变量引用该对象,同时还继承了该函数的原型。
  • 2、属性和方法被加入到this所引用的对象中。
  • 3、新创建的对象由this所引用,并且最后隐式的返回this。

30(1)JSON的了解?

json(JavaScript Object Notation)是一种轻量级的数据交换格式。它是基于JavaScript的一个子集。数据格式简单,易于读写,占用带宽小

 如:{"age":"12",""}

json字符串转换为json对象

  var obj=eval('('+str+')');
  var obj=str.parseJSON();
  var obj=JSON.parse(str);

JSON对象转换为JSON字符串

  var last=obj.toJSONString();
  var last=JSON.stringify(obj);

31、call()和play()的区别和作用?

  • 1、apply()函数有两个参数:第一个参数是上下文,第二个参数是参数组成的数组。如果上下文是null,则使用全局对象代替。
  • 如:function.apply(thi是,[1,2,3]);
  • 2、call()的第一个参数是上下文,后续是实例传入的参数序列。
  • 如:function.call(this,1,2,3);

32、JS数组去重

以下是展示三种方法

Array.prototype.unique1 = function () {
  var n = []; //一个新的临时数组
  for (var i = 0; i < this.length; i++) //遍历当前数组
  {
    //如果当前数组的第i已经保存进了临时数组,那么跳过,
    //否则把当前项push到临时数组里面
    if (n.indexOf(this[i]) == -1) n.push(this[i]);
  }
  return n;
}

Array.prototype.unique2 = function()
{
    var n = {},r=[]; //n为hash表,r为临时数组
    for(var i = 0; i < this.length; i++) //遍历当前数组
    {
        if (!n[this[i]]) //如果hash表中没有当前项
        {
            n[this[i]] = true; //存入hash表
            r.push(this[i]); //把当前数组的当前项push到临时数组里面
        }
    }
    return r;
}

Array.prototype.unique3 = function()
{
    var n = [this[0]]; //结果数组
    for(var i = 1; i < this.length; i++) //从第二项开始遍历
    {
        //如果当前数组的第i项在当前数组中第一次出现的位置不是i,
        //那么表示第i项是重复的,忽略掉。否则存入结果数组
        if (this.indexOf(this[i]) == i) n.push(this[i]);
    }
    return n;
}

36、ajax过程

  • 1、创建XMLHttpRequest对象,也就是创建一个异步调用对象。
  • 2、创建一个新的HTTP请求,并指想向该HTTP请求的方法、URL及验证信息。
  • 3、设置响应HTTP请求状态变化的函数。
  • 4、发送HTTP请求。
  • 5、获取异步调用返回的数据。
  • 6、使用JavaScript和DOM实现局部刷新。

js延迟加载的方式有哪些?

  • defer和async,动态创建DOM方式(用得最多),按需异步载入js

面向对象和类的区别?

  • 简单的说类是对象的模板。
  • 在js中没有类,所以在js中所谓的类就是构造函数,对象就是有构造函数创建出来的实例对象。面向对象就是使用面向对象的方式处理问题,面向对象是向过程进行封装。
  • 对象的概念,面向对象编程的程序实际就是多个对象的集合,我们可以把所有的事物都抽象成对象,在程序设计中可以看作:对象=属性+方法。属性就是对象的数据,而方法就是对象的行为
  • 类的概念,类是对象的模板,而对象是类的实例化。举个例子,汽车设计图可以看作是类,而具体的汽车就是对象。再比如有一个类是表示人,然后可以通过人这个模板来实例化出张三,李四...

面向对象有三大特性

  • 抽象性,需要通过核心数据和特定环境才能描述对象的具体意义
  • 封装性,封装就是讲数据和功能组合到一起,在js中对象就是键值对的集合,对象将属性和方法封装起来,方法将过程封装起来
  • 继承性,将别人的属性的方法成为自己的,传统继承基于模板(类),js中继承基于构造函数
原文地址:https://www.cnblogs.com/wanqingcui/p/9538870.html