- 定义一个对象,里面包含用户名、电话,然后将其存入localStorage的代码
var json = {username:"张三",phone:17650246248}
for(var key in json){
localStorage.setItem(key,json[key]);
}
For in 遍历对象 for of可以遍历对象吗? 不可以?原因? Symbol.interator
(string/map/set/array等) Object.prototype
2.css兼容性、代码如何优化、怎么优化网页、清除浮动、css3新的技术、语义化标签、浏览器的兼容性问题、如何居中盒子等。
3.Ajax原生对象是什么?如何完成一个完整的ajax请求?
Ajax 优点、缺点 异步、同步 跨域 同源策略 解决跨域?(jsonp 原理?)
反向代理? vue proxy(target changeOrigin pathRewrite)
后端配置 CORS(跨域资源共享 headers *)
4.你所了解的http状态码有哪一些?
5.Window.onload与$(document).ready()的区别是什么? $(function(){})
6.闭包是什么,所带来的问题是什么?闭包使用场景是什么 垃圾回收机制 怎么存储堆栈
https://blog.csdn.net/qappleh/article/details/80337630
https://blog.csdn.net/qq_21132509/article/details/80694517
7.媒体查询如何实现?rem与em、px的区别是什么?
Bootstrap(12栅格 -> xs sm md lg)
媒体查询代码
@media screen and(mix-width:500px){具体的样式}
em 默认16像素 相对于父元素定义的
1rem相对于根元素的单位
Rem的设置:document.document.style.fontSize = document.document.clientWidth / 3.75 + ‘px
Vw vh
你还了解哪些布局单位
8.采用正则表达式验证电话号码、邮箱号码
9.Cookie/localStorage、sessionStorage的区别是什么? 本地存储与Vuex的异同
怎么存cookie/localstorage,怎么取,哪些情况下会用到
本地存储是永久性存储,主要是不同页面之间的存储。Vuex强调的是多个组件之间进行的存储
10.简述css盒模型(标准与怪异盒模型)
IE9(标准盒模型) width=padding+margin+border
IE8(怪异盒模型)width=content+padding+border
项目中标准盒模型改成怪异盒模型:box-sizing:border-box 默认是标准盒模型(content-box)
11.什么是viewport?
移动端浏览器中用来显示网页的区域
12.position定位属性有哪几个?区别分别是什么?
Static、absolute(会破坏文档流的结构)、relative、fixed
一般父元素加相对定位,这样子元素再加绝对定位就会根据父元素的位置进行偏移
13.什么是css预处理器?请描述一些简单的语法规则
Less、scss、stylus
Scss:$定义变量、{}嵌套&、封装一些css样式在用的时候进行@include引用
14.阻止事件默认行为和事件的冒泡方法分别是什么?(w3c与非w3c浏览器)
e.preventDefault return false
e.stopPropagation() e.cancelBubble = true
事件流机制:冒泡(从下到上)和捕获(从上到下),两者都存在的情况下,先捕获后冒泡
事件绑定addEventListener()
事件委托 $(“ul”).on(“click”,’li’,e=>{ })
15.看下列代码输出结果是什么?
var a;
alert(typeof a);
alert(b);
var c = null;
alert(typeof c)
16.什么是跨域?解决跨域问题的主流方案是什么?(jsonp跨域优缺点)
17.请写出该代码的执行结果
var bb = 1;
function aa(bb){
bb=2;
alert(bb);
}
aa(bb);
alert(bb);
18.下面列出的浏览器,无webkit内核的是( D )
A.chrome B. safari C.搜狗浏览器 D.firefox
19.Call、bind与apply的区别?
call与apply都属于Function.prototype的一个方法,所以每个function实例都会有call/apply属性
两者传递参数不同,call函数第一个参数都是要传入当前对象的对象,apply不是
apply传入的是一个参数数组,也就是将多个参数组合成为一个数组传入
Call传入则是直接的参数列表。Call方法可以将一个函数的对象上下文从初始的上下文改成由thisObj指定的新对象
20.下面的代码输出结果是什么?
function Foo(){
var i=0;
return function(){
console.log(i++);
}
}
var f1 = Foo();
f2 = Foo();
f1();
f1();
21.行内元素、块级元素、空元素有哪一些?
22.为何要清除浮动?清除浮动的方式?
23.如何让chrome支持小于12px的文字?
<style>
p span{
font-size:10px;
-webkit-transform:scale(0.8);
display:block;
}
</style>
<p><span>haorooms博客测试10px</span></p>
24.如何在css中告诉浏览器使用不同的盒模型来渲染你的布局?
25.已知前端页面中,有如下table
<table id="t1">
<tr></tr>
<tr></tr>
...
<tr></tr>
</table>
请添加用户交互效果,当用户点击该表格的某一行的时候,该行背景色设置为红色的代码
26.请问以下结果会输出什么?
for(var i=0;i<5;i++){
console.log(i);
}
for(var i=0;i<5;i++){
setTimeout(function(){
console.log(i);
},1000*i);
}
for(var i=0;i<5;i++){
(function(i){
setTimeout(function(){
console.log(i);
},1000*i);
})(i);
}
for(var i=0;i<5;i++){
(function(){
setTimeout(function(){
console.log(i);
},1000*i);
})(i);
}
for(var i=0;i<5;i++){
setTimeout((function(){
console.log(i);
})(i),1000*i);
}
27.写出超链接的合理顺序(l v h a) link visited hover active
28.写出函数DateDemo()的返回结果
function DateDemo(){
for(var i=0,j=0;i<10,j<6;i++,j++){
k=i+j;
}
return k;
}
29.请实现该缺少的内部代码,交换两个数的值
var res = (function(x,y){
...补全缺少的代码....
return {
x:x,
y:y
}
})(1,2);
console.log(res.x);//打印2
console.log(res.y);//打印1
30.以下程序的执行结果为:
var array1 = [1,2];
var array2 = array1;
array1[0] = array2[1];
array2.push(3);
console.log(array1);
console.log(array2);
31.写出下列打印值:
console.log(1+"2"+"2")
console.log("1"-'2'+'2')
console.log('A'+"B"+"2")
console.log("A"-"B"+2)
32.解析链接www.qq.com?name=jack&age=18&id=100,获取其中的查询参数,并格式为js对象的代码:
如: {name:”jack”,age:18,id:100}
var str = "www.qq.com?name=jack&age=18";
var str2 = str.substring(str.lastIndexOf("?")+1);
var arr = str2.split("&");
var json = {};
for(var i=0;i<arr.length;i++){
var newArr = arr[i].split("=");
json[newArr[0]] = newArr[1];
}
33.谈一下Jquery中的bind、live、delegate、on的区别?
https://www.cnblogs.com/zagelover/articles/2840762.html
34.Jquery中如何将数组转化为json字符串,然后再转化回来?
var arr = [{usernname:"张三",age:10}]
console.log($.parseJSON(JSON.stringify(arr)));
35.什么是zepto点透问题?如何解决此问题?
http://smile-leaf-language.github.io/2016/02/02/zepto-tap/
36.输出的结果为
var myObject = {
foo:"bar",
func:function(){
var self = this;
console.log("outer func:",this.foo);
console.log("outer func",self.foo);
(function(){
console.log("inner func",this.foo);
console.log("inner func",self.foo);
})();
}
}
myObject.func();
37.下面的结果是什么?
(function(){
var a = b = 1;
})();
console.log(typeof a);
console.log(typeof b);
38.优化下面这段css代码:
.myclass{
font-family:arial,verdana,sans-serif;
border-width: 10px;
border-left-width:20px;
border-bottom-width: 5px;
color:#ff6600;
font-weight: normal;
font-size:1em;
}
39.Html中form里的action方法的get与post方法区别是什么?
40.Html元素id与class区别是什么?
41.简述src与href的区别?
42.简述同步与异步的区别?
43.如何对网站的文件和资源进行优化?
https://blog.csdn.net/xujie_0311/article/details/42418797
[1.文件合并 2.文件压缩 3.使用cdn进行托管资源 4.缓存的使用]
44.简单模拟Bootstrap的12栅格系统
45.ES6新特性
Let/const 数组对象的解构赋值 symbol set和map proxy promise async classs继承 模块导入导出 for..of循环
你如何理解ES5中的function与ES6中的类
45.编写一个高效数组去重的方法 array=[9,22,15,5,9,23,99,15]
function unique(arr){
var obj = {};
var result = [];
for(var i=0;i<arr.length;i++){
if(!obj[arr[i]]){
result.push(arr[i]);
obj[arr[i]] = true;
}
}
return result;
}
用set方法
var array=[9,22,15,5,9,23,99,15];
console.log(array.from(new set(array)))