JS搜狐面试题分析


Posted in Javascript onDecember 16, 2016

本文实例讲述了几道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程序设计有所帮助。

Javascript 相关文章推荐
jQuery学习笔记之jQuery中的$
Jan 19 Javascript
JavaScript实现自动对页面上敏感词进行屏蔽的方法
Jul 27 Javascript
JavaScript对Json的增删改属性详解
Jun 02 Javascript
JS+HTML5实现的前端购物车功能插件实例【附demo源码下载】
Oct 17 Javascript
ionic进入多级目录后隐藏底部导航栏(tabs)的完美解决方案
Nov 23 Javascript
jQuery基本筛选选择器实例代码
Feb 06 Javascript
微信小程序checkbox组件使用详解
Jan 31 Javascript
Vue组件和Route的生命周期实例详解
Feb 10 Javascript
vue实现商品加减计算总价的实例代码
Aug 12 Javascript
vue axios 简单封装以及思考
Oct 09 Javascript
Vue Router的手写实现方法实现
Mar 02 Javascript
如何使用RoughViz可视化Vue.js中的草绘图表
Jan 30 Vue.js
JS重载实现方法分析
Dec 16 #Javascript
概述一个页面从输入URL到页面加载完的过程
Dec 16 #Javascript
详解MVC如何使用开源分页插件(shenniu.pager.js)
Dec 16 #Javascript
js继承实现方法详解
Dec 16 #Javascript
详解jQuery简单的表格应用
Dec 16 #Javascript
JS中parseInt()和map()用法分析
Dec 16 #Javascript
HTML5canvas 绘制一个圆环形的进度表示实例
Dec 16 #Javascript
You might like
PHP的error_reporting错误级别变量对照表
2014/07/08 PHP
php处理抢购类功能的高并发请求
2018/02/08 PHP
关于JavaScript的gzip静态压缩方法
2007/01/05 Javascript
JQuery验证工具类搜集整理
2013/01/16 Javascript
动态改变div的z-index属性的简单实例
2013/08/08 Javascript
JQuery文本改变触发事件如聚焦事件、失焦事件
2014/01/15 Javascript
jQuery实现首页顶部可伸缩广告特效代码
2015/04/15 Javascript
jquery 中ajax执行的优先级
2015/06/22 Javascript
基于javascript实现图片切换效果
2016/04/17 Javascript
基于Bootstrap实现图片轮播效果
2016/05/22 Javascript
js删除Array数组中指定元素的两种方法
2016/08/03 Javascript
彻底学会Angular.js中的transclusion
2017/03/12 Javascript
nodejs个人博客开发第二步 入口文件
2017/04/12 NodeJs
Angular4实现鼠标悬停3d倾斜效果
2017/10/25 Javascript
JS删除数组里的某个元素方法
2018/02/03 Javascript
3种vue路由传参的基本模式
2018/02/22 Javascript
GOJS+VUE实现流程图效果
2018/12/01 Javascript
浅谈发布订阅模式与观察者模式
2019/04/09 Javascript
openlayers 3实现车辆轨迹回放
2020/09/24 Javascript
解决pyinstaller打包exe文件出现命令窗口一闪而过的问题
2018/10/31 Python
Python利用pandas处理Excel数据的应用详解
2019/06/18 Python
Python完成哈夫曼树编码过程及原理详解
2019/07/29 Python
Python Web框架之Django框架Form组件用法详解
2019/08/16 Python
Python如何实现机器人聊天
2020/09/10 Python
python动态规划算法实例详解
2020/11/22 Python
详解FireFox下Canvas使用图像合成绘制SVG的Bug
2019/07/10 HTML / CSS
美国户外生活方式品牌:Eddie Bauer
2016/12/28 全球购物
上海天奕面试题笔试题
2015/04/19 面试题
销售找工作求职信
2013/12/20 职场文书
火锅店营销方案
2014/02/26 职场文书
室内设计专业毕业生求职信
2014/05/02 职场文书
销售岗位职责范本
2014/06/12 职场文书
幼儿教师师德师风演讲稿
2014/08/22 职场文书
国庆节促销广告语2014
2014/09/19 职场文书
关于倡议书的范文
2015/04/29 职场文书
详解如何使用Nginx解决跨域问题
2022/05/06 Servers