一、对闭包的理解,实现一个暴露内部变量,而且外部可以访问修改的函数(get和set,闭包实现)
Q1:闭包是指有权访问另一个函数作用域中的变量的函数。创建闭包的常见方式,就是在一个函数内部创建另一个函数。
ECMAScript中对闭包的解释:
允许使用内部函数(即函数定义和函数表达式位于另一个函数的函数体内),而且,这些内部函数可以访问它们所在的外部函数中声明的所有局部变量、参数和声明的其它内部函数。当内部函数在包含它的外部函数之外被调用时,就会形成闭包。即内部函数在外部函数返回后也可以被执行。当内部函数执行时,它访问的外部函数的局部变量、参数和函数声明是外部函数返回时的值,但也会受到内部函数的影响。
Q2:
var person=(function(){
var name='xiaoming';
return{
getName:function(){
return name;
},
setName:function(newName){
name=newName;
return newName;
}
};
})();
console.log(person.name);
console.log(person.getName());
console.log(person.setName('xiaohua'));
二、{}=={}? []==[]? null==undefined?
console.log({}=={});//false
console.log([]==[]);//false
console.log(null==undefined);//true
[] == [] ?这个好理解. 当两个值都是对象 (引用值) 时, 比较的是两个引用值在内存中是否是同一个对象. 因为此 [] 非彼 [], 虽然同为空数组, 确是两个互不相关的空数组, 自然 == 为 false.
{}=={}? 同上。
[] == ![] 这个要牵涉到 JavaScript 中不同类型 == 比较的规则, 具体是由相关标准定义的. ![] 的值是 false, 此时表达式变为 [] == false, 参照标准, 该比较变成了 [] == ToNumber(false), 即 [] == 0. 这个时候又变成了 ToPrimitive([]) == 0, 即 '' == 0, 接下来就是比较 ToNumber('') == 0, 也就是 0 == 0, 最终结果为 true.
参考文献:[] ==[] 为 false;[] == ![] 为 true;[] == {} 为 false;为什么?
三、基本的数据类型
String,Boolean,Number,Null,Undefined
四、手写一个递归函数(考察arguments.callee,以及arguments的解释)
例:求函数阶乘
function factorial (num){
if(num<=1){
return 1;
}else{
return arguments.callee(num-1)*num;
}
}
arguments.callee是指向正在执行的函数的指针,可以用它来实现对函数的递归调用。
标识符arguments是指向实参对象的引用,实参对象是一个类数组,可以通过数字下标访问传入函数的实参值。(省略的实参都是undefined,多出的参数自动省略。)
注意:arguments.callee只能用于非严格模式下,在严格模式下,不能通过脚本访问arguments.callee。可以使用命名函数表达式来解决。
格式:var 变量=(函数f);//即把函数赋值给了另一个变量,函数的名字f仍然有效,所以递归调用可以照样完成。
var factorial=(function f(num){
if(num<=1) {return 1;
}else{
return f(num-1)*num;
}
});
参考文献:《JavaScript高级程序设计》
五、对前端路由的理解?前后端路由的区别?
路由:根据不同的url地址展示不同的内容或者页面。
Q1:
前端路由:把不同的路由对应不同的内容或页面的任务交给前端来做。
应用场景:单页面应用,大部分页面结构不变,只改变部分内容的使用。
实现方式:
1)改变hash值,监听onhashchange事件。
优点:兼容低版本浏览器
2)使用historyAPI,监听popState事件,用pushState和replaceState来实现。
Q2:
后端路由每次访问新页面需要向服务器重新发送请求,服务器再响应请求,这个过程可能会有延迟。
前端路由访问新页面时仅仅是变换路径,没有网络延迟。
参考文献:
前端路由与后端路由
关于前端路由和后端路由的一点思考
六、前后端分离的意义以及对前端工程化的理解
Q1:
1、项目一开始制作前端页面时,不再需要后台配置服务器环境。
2、前端不需要向后台提供模板,或是后台在前端html中嵌入后台代码。
3、后台没有时间提供接口时,前端可以将数据先写死或者调用本地的json文件即可。
4、页面的增加和路由的修改可以在前端实现,开发更加灵活。
5、通过前端路由配置,我们可以实现页面的按需加载,无需一开始加载页面便加载网站的所有资源,服务器也不再需要解析前端页面。
6、通过目前主流的MVC框架,我们可以非常快速的定位及发现问题的所在,客户端问题不再需要后台人员参与及调试,代码重构及可维护性强。
Q2:
完整的前端工程体系应该包括:
1、统一的开发规范;
2、组件化开发;
3、构建流程。
参考文献:
我们为什么要尝试前后端分离
浅析前端工程化
七、手写类式继承并解释。
3.类式继承(适合new构造函数)
利用构造函数继承的方式。
JS中没有类的概念,把JS的构造函数看做类。
function Father(){
this.name='晓明';
}
Father.prototype.showName=function(){
alert(this.name);
};
function Son(){}
Son.prototype=new Father();//一句话实现继承,但存在很多问题
var s1=new Son();
s1.showName();//晓明
alert(s1.constructor);//Father
存在问题:
1.person.constructor指向Father而不是Son.
这是因为Son.prototype=new Father();这句话重写了Son.prototype,Son.prototype下原有的constructor等属性被覆盖。
解决:修正Son.prototype.constructor,Son.prototype.constructor=Son;
2.子类实例的属性均指向父类中的属性,会相互影响。
解决:属性和方法分别单独继承。
1)创建一个没有属性的空函数F,专门用来继承父类的方法。
2)属性采用call方法继承。
类式继承完整例子:
function Father(){
this.name=[1,2,3];
}
Father.prototype.showName=function(){
alert(this.name);
};
function Son(){
Father.call(this);//属性继承,用call方法修改this指向
}
//方法继承
var F=function(){};//创建一个没有属性的空函数F,专门用来继承父类的方法。
F.prototype=Father.prototype;
Son.prototype=new F();//一句话实现继承
Son.prototype.constructor=Son;
var s1=new Son();
s1.name.push(4);
s1.showName();//1,2,3,4
var s2=new Son();
alert(s2.name);//1,2,3。属性单独继承后,不同实例的属性相互独立,互不影响。
八、js轮播实现思路
图片轮播的原理就是图片排成一行,然后准备一个只有一张图片大小的容器,对这个容器设置超出部分隐藏(overflow:hidden),在设定定时器或点击左右方向键来让这些图片整体左移或右移,这样呈现出来的效果就是图片在轮播。
九、(==)和(!=)运算规则
1、当两个操作数类型相同时,直接比较,相等返回true,不相等返回false。
2,、当两个操作数类型不同时,先转换成相似类型再进行比较。
转换规则:
1)操作数是布尔值,比较之前先转换为数值。false转换为0,true转换为1。
2)操作数是字符串和数值,比较之前先将字符串转换为数值。
3)操作数是对象和非对象,调用对象的valueof()方法,用得到的基本类型值进行比较或按照前面的规则进行转换。
比较规则:
1)null==undefined
2)比较相等性之前,不能将null或者undefined转换成其他任何值。
3)有一个操作数为NaN,则==结果为false,!=结果为true。NaN!=NaN
4)两个操作数都是对象,仅当两个操作数指向同一个对象时返回true,否则,返回false。
十、文档模式doctype
1、混杂模式:该模式下IE的行为与IE5相同。文档开始处没有发现文档类型声明或者文档类型声明有错误,所有浏览器会默认开启混杂模式。在混杂模式下,不同浏览器的行为差别很大,故不推荐。
2、标准模式:该模式下IE的行为更接近标准行为。
①严格型(strict)
②过渡型(transitional)
③框架集型(frameset)
网友评论