技术hr 面试的一些问题？

hr面试的一些问题？（前端）

• 我认为的前端

我认为的前端，是一个网页展示给用户可以直观看到的东西，应该先由ui设计师设计出psd图，然后交给前端开发人员，
前端开发人员用代码去实现，包括基本的HTML和CSS以及JavaScript/ajax，现在最新的高级版本HTML5、CSS3，以及SVG等。

• HTML
• css
• css3新特性
• HTML5新特性

html5:

新的语义元素，比如 header、nav、section、 article、aside、footer、

更好的表格体系：可以定义每个表格单元的输入格式，也可以定义这个单元是否是必填的等。新的表单控件(input)，比如 calendar、date、time、email、url、search
input新增属性：placeholder required autofocus，新增正则表达式在input中

新增属性选择器和伪类选择器

音频、视频API：用于媒介回放的 video 和 audio 元素

用于图形的绘制的 canvas 元素，通过脚本 (通常是JavaScript)来完成.

HTML5 Geolocation API 用于获得用户的地理位置。

网页存储(Web storage) API：对本地离线存储的更好的支持：sessionStorage（短期）， 本地离线存储 localStorage ，新的API相对于cookie也有着高安全性

拖拽释放(Drag and drop) API 


css3:

RGBa新特性允许你对每个元素进行色彩以及透明度的设置

多栏布局选择器无需 HTML 布局标签即可生成多栏布局，同时‘栏数’、‘栏宽’以及‘栏间距’都是可以定义的。

CSS3实现圆角（border-radius），阴影（box-shadow）

@font-face功能会自动的、默默地帮用户从网络上下载相应字体
对文字加特效（text-shadow、），线性渐变（gradient），旋转（transform）

还有渐变、防止字符串过长溢出、多重背景以及用图片来作为元素边框等功能

transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg);// 旋转,缩放,定位,倾斜

在CSS3中唯一引入的伪元素是 ::selection.

 媒体查询（and,or,not），

 border-image

参考： 浅谈HTML5 & CSS3的新交互特性

• javascript

html 是网页的骨架，展示页面内容的，
css 是修饰html的，添加一些好看的样式
JavaScript 是向页面添加事件行为的。用于客户端的脚本语言，用来给HTML网页增加动态功能。

• jquery

• ajax

ajax实现前后端交互，前端和服务端之间的数据交互一般是通过发起ajax请求来完成的。
ajax好处：实现无需刷新就可以更新页面数据，增强了用户体验

• es6新特性

（1）箭头函数，对于function函数，省略function和大括号只保留参数和内容，如果只有一条语句可以省略return。
（2）类的支持，导出模块
（3）字符串模板  （字符串里面输出一个变量）$ {NAME}，并把它放在反引号里
（4）Symbol是一种基本类型，像数字，字符串还有布尔一样，它不是一个对象。
（5）延展操作符：通过它可以将数组作为参数直接传入函数。在函数定义时可以通过…rest获取定义参数外的所有参数
（6）ES6，我们可以直接把默认值放在函数申明里
（7）解构赋值，就是可以直接给数组赋值
（8）新的变量声明let

https://blog.csdn.net/u012860063/article/details/62218564

• bootstrap
• vue
• nodejs
• git
  git版本管理

可以记录文件内容的变化，可以随时将某个文件或者整个项目回退上一个版本修改内容

命令
git init
git status
git log
git commit -m “我添加一个文件readme.txt” （对勾） 提交
git checkout – readme.txt 反悔 撤销

• mysql
  mysql命令

• mongodb

• 微信小程序

• 闭包：
  本质上就是函数套函数，
  它有什么好处？可以让外部的变量访问内部的函数，本来局部变量在函数执行完就消亡了，不能被访问，节省内存。闭包：变量不能消亡。

• jquery，举例一些类似date的控件

• jQuery和Vue的区别：
  jQuery是使用选择器（$）选取DOM对象，对其进行赋值、取值、事件绑定等操作，其实和原生的HTML的区别只在于可以更方便的选取和操作DOM对象，而数据和界面是在一起的。比如需要获取label标签的内容：$(“lable”).val();,它还是依赖DOM元素的值。
  Vue则是通过Vue对象将数据和View完全分离开来了。对数据进行操作不再需要引用相应的DOM对象，可以说数据和View是分离的，他们通过Vue对象这个vm实现相互的绑定。这就是传说中的MVVM。

• bootstrap在哪里有体现？

• 为什么选择nodejs?

• vue?

• 小程序用的是什么框架？

---

web前端面试总结（职责补充）

1. web页面的渲染原理

在浏览器输入网址，提交，浏览器对请求的url域名解析，然后向服务器发起请求，解析HTML，css,js文件等

1. 浏览器会将HTML解析成一个DOM树，DOM 树的构建过程是一个深度遍历过程：当前节点的所有子节点都构建好后才会去构建当前节点的下一个兄弟节点。

2. 将CSS解析成 CSS Rule Tree 。

3. 根据DOM树和CSSOM来构造 Rendering Tree。注意：Rendering Tree 渲染树并不等同于 DOM 树，因为一些像Header或display:none的东西就没必要放在渲染树中了。

4. 有了Render Tree，浏览器已经能知道网页中有哪些节点、各个节点的CSS定义以及他们的从属关系。下一步操作称之为layout，顾名思义就是计算出每个节点在屏幕中的位置。

5. 再下一步就是绘制，即遍历render树，并使用UI后端层绘制每个节点。

2. Vue架构的原理

3.前端缓存

cookie localstorage sessionstorage

4. 移动内嵌浏览器内核

全球仅有四大浏览器内核
　　目前全球仅有四个独立的浏览器内核，分别为
　　微软IE的Trident、
　　网景最初研发后卖给Mozilla基金会并演化成火狐的Gecko、
　　KDE的开源内核Webkit
　　以及Opera(欧朋)的Presto。
　　其中，Presto是历史最悠久的内核。
　　目前微软的Trident在移动终端上主要为WP7系统内置浏览器
Opera的Presto内核在所有联网设备上都使用，移动终端上主要为 Opera Mobile、OperaMini、欧朋浏览器以及欧朋HD Beta版
Webkit内核的适用范围则较为广泛，Android原生浏览器、苹果的Safari、谷歌的Chrome(Android4.0使用)都是基于Webkit开源内核开发的。

---

1. 关于for循环中引用setTimeout

   for（var i=1;i<=3;i++）{
   setTimeOut(function(){
   console.log(i);
   },0);
   }
   上面这个代码块会打印三个 4 出来，而我们预想的结果是打印 1 2 3 。
   之所以会这样，是因为 setTimeout 中的 i 是对外层 i 的引用。当 setTimeout 的代码被解释的时候，运行时只是记录了 i 的引用，而不是值。而当 setTimeout 被触发时，三个 setTimeout 中的 i 同时被取值，由于它们都指向了外层的同一个 i，而那个 i 的值在迭代完成时为 4，所以打印了三次 4。

全文地址请点击：https://blog.csdn.net/u012872875/article/details/52601477?utm_source=copy

2. 前端面试题
   https://blog.csdn.net/liuwengai/article/details/52628652