1.有这样一个URL:http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e,请写一段JS程序提取URL中的各个GET参数(参数名和参数个数不确定),将其按key-value形式返回到一个json结构中,如{a:’1′, b:’2′, c:”, d:’xxx’, e:undefined}。
function serlize(url){ var result={}; //1、寻找?后面的字符串 url=url.substr(url.indexOf("?")+1); //2、将字符串用&分隔 var args=url.split("&");//[“a=1”,”b=2”] for (var i = 0, len = args.length; i < len; i++) { var arg = args[i]; var item = arg.split('='); //3、对象的键=值 result[item[0]]= item[1]; } return result; }
2.正则表达式构造函数var reg=new RegExp(“xxx”)与正则表达字面量var reg=//有什么不同?匹配邮箱的正则表达式?
RegExp
答案:当使用RegExp()构造函数的时候,不仅需要转义引号(即”表示”),并且还需要双反斜杠(即表示一个)。使用正则表达字面量的效率更高。
邮箱的正则匹配:
var regMail = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/;
3.希望获取到页面中所有的checkbox怎么做?(不使用第三方框架)
var domList = document.getElementsByTagName(‘input’)
var checkBoxList = [];
var len = domList.length; //缓存到局部变量
while (len--) {
if (domList[len].type == ‘checkbox’) {
checkBoxList.push(domList[len]);
}}
4.DOM操作——怎样添加、移除、移动、复制、创建和查找节点。
<1>创建新节点
createDocumentFragment() // 创建一个DOM片段
createElement() // 创建一个具体的元素
createTextNode() // 创建一个文本节点
<2>添加、移除、替换、插入
appendChild()
removeChild()
replaceChild()
insertBefore() // 在已有的子节点前插入一个新的子节点
<3>查找
getElementsByTagName() // 通过标签名称
getElementsByName() // 通过元素的Name属性的值(IE容错能力较强,会得到一个数组,其中包括id等于name值的)
getElementById() // 通过元素Id,唯一性
5.下面这个ul,如何点击每一列的时候alert其index?(闭包)
<ul id=”test”> <li>这是第一条</li> <li>这是第二条</li> <li>这是第三条</li> </ul> // 方法一: var lis=document.getElementById('2223').getElementsByTagName('li'); for(var i=0;i<3;i++) { lis[i].index=i; lis[i].onclick=function(){ alert(this.index); }; } //方法二: var lis=document.getElementById('2223').getElementsByTagName('li'); for(var i=0;i<3;i++){ lis[i].index=i; lis[i].onclick=(function(a){ return function() { alert(a); } })(i); }
6.(设计题)想实现一个对页面某个节点的拖曳?如何做?(使用原生JS)
回答出概念即可,下面是几个要点
1. 给需要拖拽的节点绑定mousedown, mousemove, mouseup事件
2. mousedown事件触发后,开始拖拽
3. mousemove时,需要通过event.clientX和clientY获取拖拽位置,并实时更新位置
4. mouseup时,拖拽结束
5. 需要注意浏览器边界的情况
7.AMD(Modules/Asynchronous-Definition)、CMD(Common Module Definition)规范区别?
1、对于依赖的模块,AMD 是提前执行,CMD 是延迟执行。不过 RequireJS 从 2.0 开始,也改成可以延迟执行(根据写法不同,处理方式不同)。CMD 推崇 as lazy as possible.
2、CMD 推崇依赖就近,AMD 推崇依赖前置。
3. AMD 的 API 默认是一个当多个用,CMD 的 API 严格区分,推崇职责单一。比如 AMD 里,require 分全局 require 和局部 require,都叫 require。CMD 里,没有全局 require,而是根据模块系统的完备性,提供 seajs.use 来实现模块系统的加载启动。CMD 里,每个 API 都简单纯粹。
8.ECMAScript6 怎么写class么,为什么会出现class这种东西?
class Point { constructor(x, y) { this.x = x; this.y = y; } toString() { return '('+this.x+', '+this.y+')'; } }
9.call() 和 apply() 的含义和区别?
apply的参数是数组形式,call的参数是单个的值,除此之外在使用上没有差别,重点理解这两个函数调用的this改变
10.数组和对象有哪些原生方法,列举一下?
Array.concat( ) 连接数组
Array.join( ) 将数组元素连接起来以构建一个字符串
Array.length 数组的大小
Array.pop( ) 删除并返回数组的最后一个元素
Array.push( ) 给数组添加元素
Array.reverse( ) 颠倒数组中元素的顺序
Array.shift( ) 将元素移出数组
Array.slice( ) 返回数组的一部分
Array.sort( ) 对数组元素进行排序
Array.splice( ) 插入、删除或替换数组的元素
Array.toLocaleString( ) 把数组转换成局部字符串
Array.toString( ) 将数组转换成一个字符串
Array.unshift( ) 在数组头部插入一个元素
Object对象的常用方法
Object.hasOwnProperty( ) 检查属性是否被继承
Object.isPrototypeOf( ) 一个对象是否是另一个对象的原型
Object.propertyIsEnumerable( ) 是否可以通过for/in循环看到属性
Object.toLocaleString( ) 返回对象的本地字符串表示
Object.toString( ) 定义一个对象的字符串表示
Object.valueOf( ) 指定对象的原始值
11.JavaScript原型,原型链 ? 有什么特点?
* 原型对象也是普通的对象,是对象一个自带隐式的 __proto__ 属性,原型也有可能有自己的原型,如果一个原型对象的原型不为null的话,我们就称之为原型链。 * 原型链是由一些用来继承和共享属性的对象组成的(有限的)对象链。 * JavaScript的数据对象有那些属性值? writable:这个属性的值是否可以改。 configurable:这个属性的配置是否可以删除,修改。 enumerable:这个属性是否能在for…in循环中遍历出来或在Object.keys中列举出来。 value:属性值。 * 当我们需要一个属性的时,Javascript引擎会先看当前对象中是否有这个属性, 如果没有的话,就会查找他的Prototype对象是否有这个属性。 function clone(proto) { function Dummy() { } Dummy.prototype = proto; Dummy.prototype.constructor = Dummy; return new Dummy(); //等价于Object.create(Person); } function object(old) { function F() {}; F.prototype = old; return new F(); } var newObj = object(oldObject);
12.异步加载的方式
(1) defer,只支持IE
(2) async:
(3) 创建script,插入到DOM中,加载完毕后callBack
documen.write和 innerHTML的区别
document.write只能重绘整个页面
innerHTML可以重绘页面的一部分
13.”==”和“===”的不同
前者会自动转换类型,再判断是否相等
后者不会自动类型转换,直接去比较