JS搜狐面试题分析

 更新时间:2016年12月16日 14:50:22   作者:鬼畜十三  
这篇文章主要介绍了JS搜狐面试题,涉及javascript数组、字符串及面向对象程序设计相关技巧,需要的朋友可以参考下

本文实例讲述了几道JS搜狐面试题。分享给大家供大家参考,具体如下:

一、实现一个遍历数组或对象里所有成员的迭代器。

var each = function(obj, fn){
    //+++++++++++答题区域+++++++++++
    //+++++++++++答题结束+++++++++++
};
try{
    var data1 = [4,5,6,7,8,9,10,11,12];
    var data2 = {
        "a": 4,
        "b": 5,
        "c": 6
    };
    console.group(data1);
    each(data1, function(o){
        if( 6 == this )
            return true;
        else if( 8 == this )
            return false;
        console.log(o + ": \"" + this + "\"");
    });
    console.groupEnd();
    /*------[执行结果]------
    1: "4"
    2: "5"
    4: "7"
    ------------------*/
    console.group(data2);
    each(data2, function(v, n){
        if( 5 == this )
            return true;
        console.log(n + ": \"" + v + "\"");
    });
    console.groupEnd();
    /*------[执行结果]------
    a: "4"
    c: "6"
    ------------------*/
}catch(e){
    console.error("执行出错,错误信息: " + e);
}

【思路分析】

1.首先判断传进来的是数组还是对象,用到instanceof,typeof和instanceof都可以用来判断js变量类型,用法区别

typeof(obj) //typeof会返回一个基本数据类型

obj instanceof Array //instanceof一般是用来验证一个对象是否属于某类

注:typeof遇到null,数组,对象都会返回object类型

var each = function(obj, fn){
  if(obj instanceof Array){
  }
  else if(obj instanceof Object){
  }
};

2.遍历数组和遍历对象的区别

遍历数组:

for(var i=0,j=array.length;i<j;i++){
  alert(array[i]);
}

遍历对象:

for(var e in data){
  alert(data[e]);
}

3.分析结果

each(data1, function(o){
  if( 6 == this )
    return true;      //表示跳过并继续遍历
  else if( 8 == this )
    return false;     //表示停止遍历
  console.log(o + ": \"" + this + "\"");
});

如果直接for循环,那会输出数组所有元素,现在有个each函数,应该让他指向obj中的元素(即改变this指向,让this代表obj[i])

fn.call(obj[i],i+1); //fn是each的第二个参数,让这个函数指向obj中的元素,第一个参数o,让让它传值i+1

仅仅这样会输出4,5,7,8,9,10,11,12,所以还需要限定让它等于8的时候跳出整个循环

if(obj instanceof Array){
  for(var i=0,j=obj.length;i<j;i++){
    var temp=fn.call(obj[i],i+1);
    if(temp===false){    //===值和类型都要等,==只是值相同null==false
      return;
    }
  }
}

同理,遍历对象

else if(obj instanceof Object){
  for(var e in obj){
    fn.call(obj[e],obj[e],e);    //第一个参数v(对象值),第二个n(对象索引)
  }
}

注:obj instanceof Object要在obj instanceof Array之后,因为数组属于对象,Object在前面的话,后面的判断就不执行了

二、实现一个叫Man的类,包含attr, words, say三个方法。

var Man;
//+++++++++++答题区域+++++++++++
//+++++++++++答题结束+++++++++++
try{
    var me = Man({ fullname: "小红" });
    var she = new Man({ fullname: "小红" });
    console.group();
    console.info("我的名字是:" + me.attr("fullname") + "\n我的性别是:" + me.attr("gender"));
    console.groupEnd();
    /*------[执行结果]------
    我的名字是:小红
    我的性别是:<用户未输入>
    ------------------*/
    me.attr("fullname", "小明");
    me.attr("gender", "男");
    me.fullname = "废柴";
    me.gender = "人妖";
    she.attr("gender", "女");
    console.group();
    console.info("我的名字是:" + me.attr("fullname") + "\n我的性别是:" + me.attr("gender"));
    console.groupEnd();
    /*------[执行结果]------
    我的名字是:小明
    我的性别是:男
    ------------------*/
    console.group();
    console.info("我的名字是:" + she.attr("fullname") + "\n我的性别是:" + she.attr("gender"));
    console.groupEnd();
    /*------[执行结果]------
    我的名字是:小红
    我的性别是:女
    ------------------*/
    me.attr({
        "words-limit": 3,
        "words-emote": "微笑"
    });
    me.words("我喜欢看视频。");
    me.words("我们的办公室太漂亮了。");
    me.words("视频里美女真多!");
    me.words("我平时都看优酷!");
    console.group();
    console.log(me.say());
    /*------[执行结果]------
    小明微笑:"我喜欢看视频。我们的办公室太漂亮了。视频里美女真多!"
    ------------------*/
    me.attr({
        "words-limit": 2,
        "words-emote": "喊"
    });
    console.log(me.say());
    console.groupEnd();
    /*------[执行结果]------
    小明喊:"我喜欢看视频。我们的办公室太漂亮了。"
    ------------------*/
}catch(e){
    console.error("执行出错,错误信息: " + e);
}

思路分析:

1.先来一个构造函数

Man=function(info){
};

2.

var me = Man({ fullname: "小红" });
var she = new Man({ fullname: "小红" });

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结

希望本文所述对大家JavaScript程序设计有所帮助。

相关文章

  • JsChart组件使用详解

    JsChart组件使用详解

    JSChart能够在网页上生成图标,常用于统计信息,十分好用的一个JS组件。这篇文章主要介绍了JsChart组件使用详解,需要的朋友可以参考下
    2018-03-03
  • JavaScript中的View-Model使用介绍

    JavaScript中的View-Model使用介绍

    这是一个十分常见的微博列表页面,类似于新浪微博。上周末,在心无旁骛情况下,一共用了5个对象,产出400行代码,实践出一种代码组织模式。
    2011-08-08
  • jQuery实现腾讯信用界面(自制刻度尺)样式

    jQuery实现腾讯信用界面(自制刻度尺)样式

    这篇文章主要介绍了jQuery实现腾讯信用界面(自制刻度尺)样式,下文还总结了关于jquery中extend的方法,需要的朋友可以参考下
    2017-08-08
  • js截取函数(indexOf,join等)

    js截取函数(indexOf,join等)

    下面是js中截取字符串经常会用到的一些函数,这里每个函数都给出了例子,学习的朋友可以参考下。
    2010-09-09
  • 最佳的addEvent事件绑定是怎样诞生的

    最佳的addEvent事件绑定是怎样诞生的

    IE的 JScript 存在内存泄露的bug 想必大家都清楚或者有耳闻了。这是由于IE的内存回收管理器的一个设计错误导致的
    2011-10-10
  • 原生js获取left值和top值的三种方法

    原生js获取left值和top值的三种方法

    下面小编就为大家带来一篇原生js获取left值和top值的三种方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • javascript中的parseInt和parseFloat区别

    javascript中的parseInt和parseFloat区别

    这篇文章用简单的小例子演示了parseInt和parseFloat区别,有需要的朋友可以参考一下
    2013-07-07
  • JavaScript ECharts可视化图表库

    JavaScript ECharts可视化图表库

    这篇文章主要介绍了JavaScript ECharts可视化图表库,ECharts是一款基于JavaScript的数据可视化图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表
    2023-01-01
  • JS判断浏览器是否安装flash插件的简单方法

    JS判断浏览器是否安装flash插件的简单方法

    下面小编就为大家带来一篇JS判断浏览器是否安装flash插件的简单方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-09-09
  • 一个特帅的展示图片的js+css

    一个特帅的展示图片的js+css

    一个特帅的展示图片的js+css...
    2006-08-08

最新评论