二. HTML, CSS, JS篇
1.了解css3动画特效怎么实现的吗?
2 .css3新特性有哪些?
3.写过一些什么特效?
4. 数组的splice方法应该注意些什么问题?
5.如何解决跨域问题?
6.let const var的区别?
7.如何求解数据类型?
8 .true && 0 和 true && false分别返回什么?
9. 如何进行深拷贝?
10. js基本数据类型和引用数据类型分别有哪些？
11.怎么理解html标签语义化?
12.html有哪些语义化标签?
13.bfc是什么?有什么作用
14. flex有些什么属性?
15. 标准盒模型和怪异盒模型的区别?
16. js中Map和Set有什么区别?
17.async await如何处理异常?
18 .css选择器的优先级？
19.什么是js的事件循环机制?
20. 301和302的区别?
二. 笔试题目
1.下列代码的输出结果是？
2.如何获取当前月份
3.对下列代码求解数据类型
4.给id为foo的元素的第一个ul的偶数位置li设置文字颜色为红色
5.js如何获取元素
6.找出字符串a在字符串b中的位置
7.如何将一个整数转为二进制数
1.了解css3动画特效怎么实现的吗?
css3动画特效主要实现方式有两种：
1.通过animation: 动画名称 duration 搭配@keyframes等属性设置
2.通过transition: 要修改的属性 duration liner等属性设置
两者区别：前者不需要触发，定义动画后自动播放，后者需要触发一个事件(若要使用js灵活设定动画，用transition)
2.css3新特性有哪些?
border-radius: 圆角边框属性
background-color: 背景色
text-shadow: 文字阴影
animation:动画
transition: 过渡属性
liner-gradient: 渐变色
transform: 2D效果等
3.写过一些什么特效?
平移： transform: translateX(200px)/translateY(200px)/translate(200px. 200px)
旋转：transfrom: rotateX(45deg)/rotateY(30deg)/rotateZ(45deg)
缩放：transform: scale(2, .5)
倾斜： transform: skew(45deg, 45deg)
4. 数组的splice方法应该注意些什么问题?
splice(index, howmany, item1, item2, …)
当howmany为0时，相当于数组的增加
howmany不为0时，做数组的删除操作，删除当前index位置处的元素，并且splice是直接对原数组进行操作
5.如何解决跨域问题?
1.CORS跨域：支持任何HTTP类型的跨域，通过在后端请求头中设置‘Access-Control-Allow-Origin’即可实现前端跨域
2.JSONP跨域：只支持Get请求类型的跨域，步骤：
1）通过添加script标签
2）设置src属性
3）执行回调函数
6.let const var的区别?
1.作用域不同：var定义的变量一般是全局的作用域，let和const是块级作用域，只在某一区域内起作用
2.声明提升：var定义的变量有声明提升，let和const则没有
3. const定义的是常量，在定义就要赋值，并且不能再被修改，否则会报错，let定义的变量可以再对其重新修改值
7.如何求解数据类型?
1.typeof求解：缺点：只能求解简单的数据类型
typeof 2 // number
typeof [1, 2, 3] // object
2.instance of
var num = 5
var arr = [1, 2, 3]
num instanceof Array // false
arr instanceof Array // true
注意：数组 instanceof Object 也是true
3.constructor
var num = 3
num.constructor === String // false
num.constructor === Number // true
4.Object.prototype.toString.call()
var num = 3
var arr = [1, 2, 3]
Object.prototype.toString.call(num) // [object Number]
Object.prototype.toString.call(arr) // [object Array]
8 .true && 0 和 true && false分别返回什么?
// 布尔值和Number比较，会被隐式转化为Number在进行比较
true && 0 // 0
true && false // false
9. 如何进行深拷贝?
使用JSON.parse(JSON.stringify())
10. js基本数据类型和引用数据类型分别有哪些？
基本数据类型：String, Number, Boolean, Undefined, Null, Symbol(es6新增)；特点：值与值之间相互独立，互不影响
引用数据类型：Array, Object，Function等
11.怎么理解html标签语义化?
1.根据内容选择合适的标签
2.有利于浏览器解析
3.有利于SEO优化
4.有利于开发者开发和维护
12.html有哪些语义化标签?
<header></header>
<footer></footer>
<nav></nav>
<section></section>
<aside></aside>
<section></section>
13.bfc是什么?有什么作用
bfc是块级格式上下文，是页面中的一块渲染区域，有自己的一套渲染规则，决定了其子元素如何进行定位，也决定了元素间的相对位置关系
触发BFC：
1.display不为none;
2.position不为static和relative
3.overflow不为visible
4.float不为none
作用：清除浮动，解决margin重叠问题，自适应两栏布局等
14. flex有些什么属性?
display: flex 设置弹性盒
flex-direction：设置弹性盒方向
flex-wrap:是否换行
flex:1充满父元素剩余空间
justify-content: flex-start/flex-end
align-item: flex-start/flex-end
flex-shrink等
15. 标准盒模型和怪异盒模型的区别?
计算元素的宽度不同
标准盒模型：
左右margin+左右border+左右padding+width
怪异盒模型：
左右margin+width(包括了左右border和左右padding)
16. js中Map和Set有什么区别?
Map类似于对象，主要用于存储key-value键值对，有get(),set(),has(),clear(),delete()等方法
var map = new Map()
map.set('js', 'vue') // Map(1) {"js" => "vue"}
Set类似于数组，允许存储任何类型的唯一值，即集合中所保存的元素是不允许重复的，可用于数组去重
var arr = [1, 3, 5, 1, 2, 4, 3]
new Set(arr) // Set(5) {1, 3, 5, 2, 4}
17.async await如何处理异常?
async 和 await是基于promise进行封装的异步请求
async总是会返回一个promise对象
await总是会接收一个promise返回回来的状态
当 await接收的是一个resolved状态的promise，无论有无catch都会直接得到结果
当await接收到的是一个rejected状态的promise，catch捕获异常，返回异常结果
18 .css选择器的优先级？
!important > 行内样式(1000) > id选择器(100) > class选择器(10) = 伪类选择器 > 标签选择器(1) > 通配符选择器
注意：通配符选择器没有权重
19.什么是js的事件循环机制?
js是单线程的，主线✖️只会做一件事，就是从消息队列里去取消息并执行消息。当消息队列为空时，主线程会等待，直到消息队列不为空，再去读消息并执行消息，这就是js的事件循环机制
20. 301和302的区别?
301是永久重定向，资源永久被转移到另外一个地址
302临时重定向，资源临时被转移到其他位置
笔试部分
1.下列代码的输出结果是
function aa () {
return {
test: 1
}
}
console.log(aa()) // object
解析：因为函数aa返回一个{test: 1}对象，typeof求解对象类型为object
2.如何获取当前月份
new Date().getMonth() + 1
解析：getMonth月份是从0开始的，所以需要加一
3.对下列代码求解数据类型
let arr = [1, 2, 3, 4]
console.log(typeof arr) // object
解析：typeof只能求解简单的数据类型，数组是引用类型，只能求解到object
4.给id为foo的元素的第一个ul的偶数位置li设置文字颜色为红色
<div id="foo">
<p>写点东西</p>
<ul>
<li>aa</li>
<li>bb</li>
<li>cc</li>
<li>dd</li>
<li>ee</li>
</ul>
<p>写点东西</p>
<ul>
<li>aa</li>
<li>bb</li>
<li>cc</li>
</ul>
</div>
答案：主要考察css选择器
<style>
#foo ul:nth-child(2) li:nth-child(even) {
color: red
}
</style>
5.js如何获取元素
<div id="foo"></div>
A: document.getElementById("foo")
B: document.getElementById("#foo")
C: document.getElementsByTagName("div")
答案：B,C
6.找出字符串a在字符串b中的位置
let a = 'hello'
let b = 'hello world'
console.log(b.indexOf(a))
考察字符串的indexOf方法，从头开始，第一次出现某个元素的下标
7.如何将一个整数转为二进制数
let num = 4
console.log(num.toString(2)) // 100
注意：parseInt(str, radix)是将字符串类型的值转为整型