真正面试中,面试官往往采用的是由难到易的套路,那js和jQuery就是重中之重了,以及针对项目和所用技术方面的一些问题也就是你的必备储粮啦!
闭包简单的说就是一个函数能访问外部函数的变量,这就是闭包,不理解就看代码,例如:
function aa(x){ var num=1; function bb(y){ console.log(x+y+(++num));
}
}
aa函数中的bb函数就是闭包了,bb函数可以使用aa函数的局部变量,参数,最典型的闭包应该是下面这样,将定义在函数中的函数作为返回值
function aa(x){ var num=1; function bb(y){ console.log(x+y+(++num));
}return bb;
}
闭包的另一种作用是隔离作用域,请看下面这段代码
for(var i=0;i<2;i++){
setTimeout(function(){ console.log(i);
},0);
}
上面这段代码的执行结果是2,2而不是0,1,因为等for循环出来后,执行setTimeout中的函数时,i的值已经变成了2.
JavaScript的作用域指的是变量的作用范围,内部作用域由函数的形参,实参,局部变量,函数构成,内部作用域和外部的作用域一层层的链接起来形成作用域链,当在在函数内部要访问一个变量的时候,首先查找自己的内部作用域有没有这个变量,如果没有就到这个对象的原型对象中去查找,还是没有的话,就到该作用域所在的作用域中找,直到到window所在的作用域,每个函数在声明的时候就默认有一个外部作用域的存在了,代码如下:
var t=4;function aa(){ var num1=12;
funciton bb(){ var num2=34; console.log(t+" "+num1+" "+num2);
}
}
bb找t变量的过程就是,先到自己的内部作用域中找,发现没有找到,然后到bb所在的最近的外部变量中找,也就是aa的内部作用域,还是没有找到,再到window的作用域中找,结果找到了
ECMAscript 5添加了第二种运行模式:"严格模式"(strict mode)。顾名思义,这种模式使得Javascript在更严格的条件下运行。 设立"严格模式"的目的,主要有以下几个:
优点:
缺点:
现在网站的 JS 都会进行压缩,一些文件用了严格模式,而另一些没有。这时这些本来是严格模式的文件,被 merge 后,这个就合并到了文件的中间,不仅没有指示严格模式,反而在压缩后浪费了字节。
1、创建一个空对象,并且 this 变量引用该对象,同时还继承了该函数的原型。 2、属性和方法被加入到 this 引用的对象中。 3、新创建的对象由 this 所引用,并且最后隐式的返回 this 。
var obj = {};obj.__proto__ = Base.prototype;Base.call(obj);
hasOwnProperty()
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。 它是基于JavaScript的一个子集。数据格式简单, 易于读写, 占用带宽小 {'age':'12', 'name':'back'}
defer和async、动态创建DOM方式(用得最多)、按需异步载入js
优点:
Ajax的最大的特点: Ajax可以实现动态不刷新(局部刷新)
缺点: 1、ajax不支持浏览器back按钮。 2、安全问题 AJAX暴露了与服务器交互的细节。 3、对搜索引擎的支持比较弱。 4、破坏了程序的异常机制。 5、不容易调试。
jsonp(利用script标签的跨域能力)跨域、websocket(HTML5的新特性,是一种新协议)跨域、设置代理服务器(由服务器替我们向不同源的服务器请求数据)、CORS(跨源资源共享,cross origin resource sharing)、iframe跨域、postMessage(包含iframe的页面向iframe传递消息)
var module1 = (function(){
var _count = 0;
var m1 = function(){
//... };
var m2 = function(){
//... };
return {
m1 : m1,
m2 : m2
};
})();
(1) defer,只支持IE (2) async: false,(默认是true); (3) 创建script,插入到DOM中,加载完毕后callBack
例子中用 add 来替换 sub,add.call(sub,3,1) == add(3,1) ,所以运行结果为:alert(4); 注意:js 中的函数其实是对象,函数名是对 Function 对象的引用。
function add(a,b)
{
alert(a+b);
}
function sub(a,b){
alert(a-b);
}
add.call(sub,3,1);
jQuery中没有提供这个功能,所以你需要先编写两个jQuery的扩展:
$.fn.stringifyArray = function(array) { return JSON.stringify(array)
}
$.fn.parseArray = function(array) { return JSON.parse(array)
}
然后调用:
$("").stringifyArray(array)
var str=$("a").attr("href"); *for (var i = size; i < arr.length; i++) {}
for 循环每一次循环都查找了数组 (arr) 的.length 属性,在开始循环的时候设置一个变量来存储这个数字,可以让循环跑得更快:
for (var i = size, length = arr.length; i < length; i++) {}在函数用var声明的变量会在函数中函数体执行之前预先加载(变量回预先声明但是不会赋值) 请看代码,就会秒懂
var num=1;function aa(){ console.log(num); //undeifned
var num=2;
console.log(num); //2}
aa();
为什么在aa函数中会出现上述结果呢,这就是JavaScript的变量提升了,虽然变量num的定义在后面,不过浏览器在解析的时候,会把变量的定义放到最前面,上面的aa函数相当于
function aa(){ var num; console.log(num); //undefined
num=2;
console.log(num); //2}
简单的内存图
通过判断Global对象是否为window,如果不为window,当前脚本没有运行在浏览器中
当然,在面试中,除了要知道这些基础的知识外,很多时候需要的是你的工作经验,你有没有?接下来就是在工作中,项目中,遇到的问题,解决方案,以及思考的一些套路啦
其他问题(举一些我碰见过的及汇总下来的问题,谨供大家参考)
优点
缺点
(1) 减少http请求次数:CSS Sprites, JS、CSS源码压缩、图片大小控制合适;网页Gzip,CDN托管,data缓存 ,图片服务器。 (2) 前端模板 JS+数据,减少由于HTML标签导致的带宽浪费,前端用变量保存AJAX请求结果,每次操作本地变量,不用请求,减少请求次数 (3) 用innerHTML代替DOM操作,减少DOM操作次数,优化javascript性能。 (4) 当需要设置的样式很多时设置className而不是直接操作style。 (5) 少用全局变量、缓存DOM节点查找的结果。减少IO读取操作。 (6) 避免使用CSS Expression(css表达式)又称Dynamic properties(动态属性)。 (7) 图片预加载,将样式表放在顶部,将脚本放在底部 加上时间戳。 (8) 避免在页面的主体布局中使用table,table要等其中的内容完全下载之后才会显示出来,显示比div+css布局慢。
100-199 用于指定客户端应相应的某些动作。
200-299 用于表示请求成功。
300-399 用于已经移动的文件并且常被包含在定位头信息中指定新的地址信息。
400-499 用于指出客户端的错误。400 1、语义有误,当前请求无法被服务器理解。401 当前请求需要用户验证
403 服务器已经理解请求,但是拒绝执行它。500-599 用于支持服务器错误。 503 – 服务不可用
可以从你接触前端到逐步深入学习使用的过程中,你用过什么编辑器以及转化的过程和原因方面回答
Node.js、MongoDB、npm、MVVM、MEAN、three.js 、angular、React、vue github 、 知乎 、 MDN、 ES6、 Bootstrap 、 git
在面试中,其实是一个互动的环节,不仅要回答问题,也要抓住机会,获得主动权,想问公司的一些问题?
问公司问题:
最后赠言
欢迎加入我们
企业面试主要是看你能不能干的了。 企业很难招到一个适合的人,不会轻易把你淘汰掉。
如果对方挑你毛病,证明对方有招聘你的意图,否则的话,对方不会浪费时间挑你毛病,挑你毛病的主要原因是,想压榨你工资,所以你要自信一点,无论对方怎么挑你毛病都不要害怕。 企业中没有专门的面试官。
不是说我面试了这一家,他就一定要录取我,还有很多公司等着你去挑,目光放长远一点,一定要拿到自己满意的薪资才做。
面试就是一个解开双方谎言的过程,你能瞒过对方,证明你赢了。
换个心态去面试,不是企业在挑你,而是你在挑企业。昂起你自信的头颅,勇敢的去迎接挑战吧!你的未来属于你!
关注HTML公众号获得惊喜!
~END~
学习前端的过程中,我整理了很多资料和学习课程,也希望能共享出来帮助到更多刚接触或者接触前端不久的同学。