标签:safari expr items 作用 控制 解构 高度 建立 试题
这段时间去找工作,发现了很多出现概率比较高的面试题,这里记录一下,希望对大家有帮助!
盒子模型的类型和区别
盒子包括:外边距(margin)、边框(border)、内边距(padding)、实际内容(content)四个属性。
分为盒子模型(标准盒模型)和IE盒子模型(怪异盒模型),两者最大的区别是总宽/高包括的范围的不同
标准盒模型:盒子总宽度/高度=width/height+padding+border+margin。
怪异盒模型:盒子总宽度/高度=width/height + margin (即 width/height=内容区宽度/高度 + padding + border)
而box-sizing属性可以指定盒子模型种类,content-box指定盒子模型为W3C(标准盒模型),border-box为IE盒子模型(怪异盒模型)。
Js的基本数据类型
JS共有7种数据类型,分别是存储在堆里的引用数据类型(对象、数组和函数)和存储在栈里的原始数据类型(Undefined、Null、Boolean、Number、String)
普通函数和箭头函数的区别?
div块垂直水平居中
.box{ display: flex; justify-content:center; align-items:center; }
2.已知块级元素的宽和高,使用绝对定位+外边距设定水平垂直居中
父元素 position:relative,子元素 position:absolute;top:50%;left:50%;margin-top:-height/2;margin-left:-width/2;
3.未知块级元素的宽和高,使用绝对定位+css3样式属性transform
父元素 position:relative,子元素 position:absolute;transform: translate(-50%,-50%);
性能优化
(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布局慢。
ajax请求
ajax作用:可以不用刷新整个页面实现页面的部分更新。
主要有GET请求 POST请求
get和post的区别:
url可见性:get,参数url可见;post,url参数不可见
数据传输上:get,通过拼接url进行传递参数;post,通过body体传输参数
缓存性:get请求是可以缓存的;post请求不可以缓存
后退页面的反应:get请求页面后退时,不产生影响;post请求页面后退时,会重新提交请求
传输数据的大小:post请求传输数据比get大
安全性:post比get安全
js缓存方案
sessionStorage:临时的会话存储,只要当前的会话窗口未关闭,存储的信息就不会丢失,即便刷新了页面或者在编辑器中更改了代码,存储的会话信息也不会丢失。
localStorage:是一种如果你不主动去清除,会一直将数据存储在客户端的储存方式,即使关闭了浏览器,下次打开的时候仍然可以看到之前存储的未主动清除的数据(即便是
杀毒软件或者浏览器自带的清除功能,也不能将localStorage存储的数据清除掉)
cookie属于较老且最常见用的最多的技术了
cookie兼容所有的浏览器,但存储的数据是有大小限制,一般是4kb;
本地存储的数据会被发送到服务器
ES6的新特性
新增数据类型 const、let声明变量方式 模板字符串 对象解构赋值
延展运算符(...) 对象字面量增强 Class类的支持 Promise异步对象模块
import、export 数组、对象新增方法
在浏览器输入一个url地址,浏览器都干了什么?
域名解析 --> 发起3次握手 --> 建立连接后发起http请求 --> 服务器响应请求,浏览器得到html代码 --> 浏览器解析html代码,并请求html代码中的资源(如js、css、图片等) --> 浏览器对页面进行渲染呈现给用户
常见的浏览器内核
浏览器/RunTime | 内核(渲染引擎) | JavaScript 引擎 |
---|---|---|
Chrome | Blink(28~) | |
Webkit(Chrome 27) | V8 | |
FireFox | Gecko | SpiderMonkey |
Safari | Webkit | JavaScriptCore |
Edge | EdgeHTML | Chakra(for JavaScript) |
IE | Trident | Chakra(for JScript) |
PhantomJS | Webkit | JavaScriptCore |
Node.js | - | V8 |
注:部分内容来源于网络
未完待续...
标签:safari expr items 作用 控制 解构 高度 建立 试题
原文地址:https://www.cnblogs.com/s272/p/14926374.html