淘宝网前端开发面试题(二)--JS 面试题
所有答案仅供参考,不负责答案对错(^_^)
1.js 是什么,js 和 html 的开发如何结合?
js是javascript的缩写,是一种基于对象的、事件驱动的脚本语言。它一共由三个部分组成:分别是DOM,BOM,ECMAscript。
HTML 是超文本标记语言。HTML里的每一个标签就是JS里面的DOM节点。JS操作DOM节点就是在操作HTML的标签。
2.怎样添加、删除、复制、创建和查找节点?
添加节点:appendChild()
删除节点:removeChild()
复制节点:cloneNode()
创建元素:createElemen()
查找节点:getElementById()、getElementsByTagName()、getElementsByName()
3.怎样使用事件?IE 和 DOM 事件模型之间存在哪些主要差别?
怎样使用事件:
1).直接在DOM元素上绑定事件处理器
2).FF等浏览器遵循W3C标准来制定浏览器事件模型,使用addEventListener和removeEventListener两个函数
3).IE自己的事件模型,但主要是通过attachEvent和detachEvent两个函数来实现的。
主要差别:
DOM事件模型
使用addEventListener和removeEventListener两个函数:
window.addEventListener(‘load’,function(){…},false);
document.body.addEventListener(‘keypress’,function{…},false);
obj.addEventListener(‘mouseover’,MV,true);
function MV(){…}
addEventListener带有三个参数,第一个参数是事件类型,就是我们熟知的那些事件名字去掉前面的’on’,第二个参数是处理函数,可以直接给函数字面量或者函数名,第三个参数是boolean值,表示事件是否支持Capturing。
W3C的事件模型优点是Bubbling和Capturing都支持,并且可以在一个DOM元素上绑定多个事件处理器,各自并不会冲突。并且在处理函数内部,this关键字仍然可以使用只想被绑定的DOM元素。另外function参数列表的第一个位置(不管是否显示调用),都永远是event对象的引用。
至于它的缺点,很不幸的就只有在市场份额最大的IE浏览器下不可使用这一点。
IE事件模型
IE自己的事件模型跟W3C的类似,但主要是通过attachEvent和detachEvent两个函数来实现的:
window.attachEvent(‘onload’,function(){…});
document.body.attachEvent(‘onkeypress’,myKeyHandler);
可以发现它跟W3C的区别是没有第三个参数,而且第一个表示事件类型的参数也必须把’on’给加上。这种方式的优点就是能绑定多个事件处理函数在同一个DOM元素上。
至于它的缺点,首先IE浏览器本身只支持Bubbling不支持Capturing;而且在事件处理的function内部this关键字也无法使用,因为this永远都只想window object这个全局对象。要想得到event对象必须通过window.event方式,最后一点,在别的浏览器中,它显然是无法工作的。
最后推荐两个必须知道的IE和W3C标准的区别用法—
1)、当我们需要阻止浏览器某DOM元素的默认行为的时候在W3C下调用e.preventDefault(),而在IE下则通过window.event.returnValue=false来实现。
2)、当我们要阻止事件冒泡的时候,在W3C标准里调用e.stopPropagation(),而在IE下通过设置window.event.cancelBubble=true来实现。
4.面向对象编程:b 怎么继承 a?
function A{
this.say=function{alert("javascript");}
}
function B{}
B.prototype=new A();
Var C= new B();
C.say();
5.看看下面 alert 的结果是什么?
view sourceprint?1.function b(x, y, a) {
.arguments[2] = 10;
.alert(a);
}
b(1, 2, 3);//输出10
如果凼数体改成下面,结果又会是什么?
a = 10;
alert(arguments[2] );//输出10
6. 请编写一个 JavaScript 凼数 parseQueryString,它的用途是把 URL 参数解析为一个对象
var obj = parseQueryString(url);
alert(obj.key0) // 输出 0
1 function parseQueryString(url) { 2 var pos; 3 var obj = {}; 4 if (pos = url.indexOf("?") != -1) { 5 var urlstring = url.substring(pos + 1, url.lenght - 1); 6 var urlArr = urlstring.split("&"); 7 var keyValue = []; 8 for (var i = 0; i < urlArr.lenght; i++) { 9 keyValue = urlArr[i].split("="); 10 obj[keyValue[0]] = keyValue[1]; 11 } 12 } 13 return obj; 14 } 15 var objUrl = parseQueryString(url);
7.ajax 是什么? ajax 的交互模型? 同步和异步的区别? 如何解决跨域问题?
AJAX 指异步JavaScript及XML(Asynchronous JavaScript And XML),是一种无须刷新整个页面就能为页面中的某一部分加载数据的技术。
交互模式:交互模型就是Ajax在浏览器端引入一个执行引擎,它一边应付user的请求,一边把某些必须交给服务器处理的东西传送给服务器,同时把结果准备好,展现给user的技术模式
同步:脚本会停留并等待服务器发送回复然后再继续
异步:脚本不停留并处理可能的回复
解决跨域问题:
a.Web服务器上的代理文件
b.利用JSONP:在页面中添加一个<script>元素,由该元素来从其他服务器加载JSON数据,这种方式之所以有效是因为<script>元素的脚本没有受到限制(目前我只接触使用到这一种)
c.跨来源资源共享
8.什么是闭包?下面这个 ul,如何点击每一列的时候 alert 其 index?
<ul id=”test”>
<li>这是第一条</li><li>这是第二条</li><li>这是第三条</li> </ul>
1 function a() { 2 var ul = document.getElementById("test"); 3 var li = ul.getElementsByTagName("li"); 4 for (var i = 0; i < li.length; i++) { 5 (function (_i) { 6 li[_i].onclick = function () { 7 alert(_i); 8 } 9 })(i); 10 } 11 }
9.说说 YSlow
YSlow是由Yahoo开发者团队发布的一款基于Firebug的插件。而Firebug 又是一款基于FireFox的插件。所以说YSlow是一款基于FireFox插件的插件。
微软的IE系列浏览器不能使用YSlow。YSlow只能使用在FireFox浏览器上。如果要想使用YSlow,那么你必须先安装FireFox并且安装FireFox上的Firebug插件。
推荐博客:http://lusongsong.com/reed/362.html
转载于:https://www.cnblogs.com/muqiangwei/p/5570470.html
淘宝网前端开发面试题(二)--JS 面试题相关推荐
- 淘宝网前端开发面试题
第一部分:HTML & CSS 面试题 Doctype? 严格模式不混杂模式-如何触发这两种模式,区分它们有何意义? 行内元素有哪些?块级元素有哪些?CSS 的盒模型? CSS 引入的方式有哪 ...
- 淘宝网的技术发展史(二) ——Oracle替换MySQL
本文是<淘宝网的技术发展史>系列连载文的第二篇,在告别个人网站时代后,淘宝网的技术发展迎来了由Oracle开启的第二个时代. 文/淘宝技术大学培训专家 子柳 MySQL撑不住了 淘宝网作为 ...
- 淘宝网首页登录失败原因分析及解决…
本文分析及解决淘宝网首页登录失败等上网问题,希望对大家有所帮助.淘宝网首页登陆失败原因,登录地址可以参考另外一篇文章:淘宝网相关登录地址汇总 一:浏览器本身的故障导致不能登录 现象:什么网站都打不开, ...
- js案例:模拟淘宝网
<html><head><title>模拟淘宝网</title><meta charset="UTF-8"/><! ...
- 前端开发面试题总结之——JAVASCRIPT(一)
___________________________________________________________________________________ 相关知识点 数据类型.运算.对象 ...
- 2014年最新web前端开发面试题
2014年最新web前端开发面试题 本文是一份非常不错的2014年web前端开发工程师的面试题集锦,并附有参考答案,推荐大家参考下. 试题目录: HTML 部分 CSS 部分 JavaScript 部 ...
- 前端开发面试题(转载)
原文地址 前端开发面试题 前言 本文由我收集总结了一些前端面试题,初学者阅后也要用心钻研其中的原理,重要知识需要系统学习.透彻学习,形成自己的知识链.万不可投机取巧,临时抱佛脚只求面试侥幸混过关是错误 ...
- 【理论面试篇】收集整理来自网络上的一些常见的 经典前端、H5面试题 Web前端开发面试题...
##2017.10.30收集 面试技巧 5.1 面试形式 1) 一般而言,小公司做笔试题:大公司面谈项目经验:做地图的一定考算法 2) 面试官喜欢什么样的人 ü 技术好. ...
- 2014年最新前端开发面试题
2014年最新前端开发面试题(题目列表+答案 完整版) 转载自https://github.com/markyun/My-blog/tree/master/Front-end-Developer-Qu ...
最新文章
- 递归构造二叉树和二叉树的遍历
- 学习笔记(36):Python网络编程并发编程-IO模型介绍
- 盘点阿里程序员常用的 15 款开发者工具
- apache camel_Apache Camel的性能调整思路
- vue结合ueditor富文本编辑器(换肤分离)
- python 引入同一路径的类_Python入门 模块导入 import ...\from... import...
- C# 将DataGridView里面的数据提取到DataTable中
- 一门从业4年都没能用上的优化技术
- KinectV2+Ubuntu 14.04+Ros 配置
- laravel auth(api)-attempt 返回false_3分钟短文:Laravel把数据验证的手伸向“请求体”...
- x86 android 显卡 tablet2,Re: android4.4.2将tablet更改为phone
- 小鼠血清白蛋白包裹四氧化三铁纳米粒
- 周期信号的傅里叶变换
- mysql禁用ipv6_linux配置禁用启用IPv6
- uni-app 苹果登录
- 微信公众号三方平台开发【代微信公众号接收消息事件并响应】
- 中航重机 600765
- 多人同时编辑excel,只需一招就搞定
- 计算机向u盘拷贝速度慢,U盘复制速度慢的解决措施
- Springboot中使用@Value无法取到application.properties值