-
typeof
-
typeof NaN === 'number' true
-
js精度问题
-
0.1 + 0.2 === 0.3 false == 也是 false
-
显示/隐式
-
-
空对象 空数组
-
-
布尔相加
-
-
转 布尔值
-
-
假值列表
-
-
onload
-
-
原型链 原型继承
-
-
js 是什么
-
-
判断是否为数组
-
Array.isArray
-
算法 数组扁平化 数组拍平操作
function flatten(arr) {
let result = [];
for (let i = 0; i < arr.length; i++) {
if (Array.isArray(arr[i])) {
result = result.concat(flatten(arr[i]));
} else {
result = result.concat(arr[i]);
}
}
return result;
}
const a = [1, [2, [3, 4]]];
console.log(flatten(a));
-
手写题：实现柯里化
-
-
instanceof 如何使用
-
-
meta viewport 移动端
-
<meta name="viewport" content="width=device-width, initial-scale=1,
maximum-scale=1, minimum-scale=1,user-scalable=no">
-
HTML5 Canvas
-
-
canvas 怎么画
var canvas = document.getElementById('canvas')
var ctx = canvas.getContext('2d')
ctx.fillstyle = 'green';
ctx.fillRect(10,10,100,100)
CSS 面试题
- 1、标准盒模型、怪异盒模型计算方式和区别
- 在
标准模式下，一个块的总宽度= width + margin(左右) + padding(左右) + border(左右) IE盒模型或怪异盒模型一个块的总宽度= width + margin(左右)（即width已经包含了padding和border值）
2、水平居中、垂直居中的实现，弹性盒子布局的六个属性
*水平垂直居中
第一种
.wp {
display: flex/grid;
justify-content: center;
align-items: center;
}
第二种
.wp{
position: absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%)；
}
第三种
.wp{
display:table;
text-align:center;
line-height = height
}
第四种
.box {
position: absolute;;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}
- display:flex 六个属性
flex-drection
flex- wrap
justify-content
align-items
align-self
-
-
3、css 回流重绘，渲染页面的过程
-
-
-
4、常规页面渲染流程
html 文档---> dom tree
css --> cssom
两者一起形成渲染树
绘制页面 最终展示出来
遇到 js会暂停 优先js
-
-
-
5、 布局方式有哪些 ？ PC端 移动端如何布局 ？
圣杯布局
双飞翼布局
单行自适应布局
两列自适应
三列自适应
PC及移动端页面适配方法
设备屏幕有多种不同的分辨率，页面适配方案有如下几种：
1、全适配：响应式布局+流体布局
2、移动端适配：
流体布局+少量响应式
基于rem的布局
JS 面试题
- 1、基本数据类型和引用数据类型的区别
基本数据类型 string number boolean symbol undefined null
引用数据类型 object array function
区别
基本数据 值放在 栈中
引用数据 值放在堆中
-
-
2、es6 新特性有哪些 ？
-
3、ajax 请求原理
-
-
4、get post 请求区别
-
浏览器面试题目
-
1、浏览器的兼容性 css/js 看这个 blog.csdn.net/zfangls/art…
-
2、浏览器渲染页面的过程，服务端渲染是如何实现的 ？
-
-
var express = require('express')var app = express()app.get('/', (req, res) => { res.send( ` <html> <head> <title>hello</title> </head> <body> <h1>hello</h1> <p>world</p> </body> </html> ` )})app.listen(3001, () => { console.log('listen:3001')})require('express')
var app = express()
app.get('/', (req, res) => {
res.send(
`
<html>
<head>
<title>hello</title>
</head>
<body>
<h1>hello</h1>
<p>world</p>
</body>
</html>
`
)
})
app.listen(3001, () => {
console.log('listen:3001')
})
起服务的方法 node test.js 然后 localhost:3001 查看网页源代码 就可看到html 内容
VUE面试题目
-
1、vue生命周期，vue如何在数据更新到页面前获取元素的数据 ？
-
-
-
2、MVC MVP MVVM 的区别
-
-
-
-
3、 vuex
-
-
-
4、Vue如何调用Dom 元素 refs的解释和用法
-
-
5、v-for 一定要使用key
-
-
6、v-for v-if 不要一起使用
-
-
7 mixins解释 用法 原理
-
比较完整的版本 www.jianshu.com/p/46d0fc69f…
-
先写一点 基础的解释
-
-
-
-
8、组件通信有哪几种方式 ？
-
完整可看这一篇 segmentfault.com/a/119000001…
-
相关代码在我的github daily-practice --> 下面的vue-face
-
9、vue 数据双向绑定原理
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app">
<input type="text" id="txt">
<p id="show"></p>
</div>
</body>
<script>
var obj = {}
Object.defineProperty(obj, 'txt', {
get: function() {
return obj
},
set: function(newValue) {
document.getElementById('txt').value = newValue
document.getElementById('show').innerHTML = newValue
}
})
document.addEventListener('keyup', function(e) {
obj.txt = e.target.value
})
</script>
</html>
-
-
10、如何封装一个组件 ？
-
-
11、虚拟dom diff算法
-
-
将真实dom 转为 虚拟dom
1、真实的结构
<div class='box'>
<ul class='list'>
<li>这里是1903</li>
</ul>
</div>
2、转为虚拟vdom
var vdom = {
tag：'div',
attr:{
className:'box'
},
content:[
{
tag:'ul',
content:[
{
tag:'li',
content:data.name //'这里是1903'
}
]
}
]
}
12、vue 2.x 如何监测数组变化
Webpack 面试
- 1、项目跨域 webpack如何处理
- 核心是使用 proxy www.cnblogs.com/xyyt/p/9186…
nodejs 数据库 mysql
-
1、node.js 用来干什么的
-
-
比较小的项目，数据比较少可以使用 node 作为后端
-
2、nodejs异步怎么处理 ？
-
3、nodejs 如何做域名拦截
-
-
4、mysql怎么使用 ？
-
5、用什么工具保证一致的代码风格？为什么要这样？
-
-
6、如何用Node监听80端口
