html
css
水平垂直居中
块元素
-
弹性布局:flex
-
定位:父元素position:relative
1、绝对定位 + transform,translateX(-100px) translateY(-100px);
2、绝对定位 + margin;
3、绝对定位 + calc; -
grid:和flex一样
-
table
行内元素
- 父元素设置
text-align
line-height - 父元素设置
text-align: center;
display: table-cell;
vertical-align: middle;
父元素宽高不固定,画一个正方形子元素
- 父元素宽高自适应,不需要设置高度,子元素设置宽多少,padding-bottom就设置多少
画三角形
- 宽高为0,设置border,将不需要的其他三侧border-color设置为transparent
javascript
继承
- 原型链继承
缺点:共享原型对象,所以多个继承的类之间无法独立 - 构造函数继承(call)
缺点:无法继承原型链上的方法,会报错 - 组合继承
缺点:会多次调用父类,产生高额的性能开销 - 原型式继承:
- 寄生式继承:
- 寄生组合继承:
1、先改变子类的this指向,让其拥有父类的属性,但是访问不到原型上的方法
2、创建一个新的对象,将父类的原型挂载到新对象的__proto__上,
即obj = boject.create(parent.prototype)
3、将新对象的的构造函数指向子类
4、将子类的原型指向新对象
function Son(age){
Person.call(this,age)
}
function inheritPrototype(son,person){
var subpro = Object.create(person.prototype)
subpro.constructor = son
son.prototype = subpro
}
inheritPrototype(Son,Person)
var instances = new Son(23)
vue
双向数据绑定
vue2:
- 采用defineProperty对数据进行遍历劫持
- compiler模板,解析对应节点,为各个劫持到的属性添加getter和setter方法,并在get的时候标记目标属性,通过dep和watcher的形式收集依赖,,当数据改变的时候通过订阅者去触发对应监听回调
- 通过update更新视图
缺点:
1、无法监听数组的变化,所以在vue底层改写了数组的几种原生方法
2、不能监听没有定义的属性
3、删除对象属性和添加无法响应式,需要借助$set
vue3:
- 采用Proxy对数据进行监听
- 对数据进行代理,而不用改变原始数据
proxy:我们可以通过 Proxy 创建对于原始对象的代理对象,从而在代理对象中使用 Reflect 达到对于 JavaScript
原始操作的拦截
相比vue2优点:
1、可以监听整个对象,而不是单个属性
2、可以监听数组的变化
web相关
web安全
SQL注入:
- 原理:通过把sql命令插入到表单提交或输入域名或页面请求的查询字符串,最终达到欺骗服务器执行的sql命令
- 解决:
1、对用户的输入进行校验,可以用正则,限制长度,对单双引号和‘–’进行转换
2、参数化sql
3、为每个使用者提供单独权限的数据库连接
4、私密信息加密
XSS:
- 原理:往web页面插入恶意html或js代码
- 解决:
1、对用户输入的进行转码
2、对"<" ">"等特殊符号做过滤
3、尽量采用post提交
CSRF:
- 原理:代替用户完成指定的动作
- 解决:
1、设置ip不可用于外部
2、通过验证码
XSS和CSRF的区别:XSS是获取信息,不需要知道其他数据,而XSRF书需要知道其他数据来代替用户完成操作
HTTP和HTTPS
HTTP协议通常承载于TCP协议之上
而HTTPS是在HTTP和TCP之间添加了一个安全协议层(SSL或TSL)
工具
commonJs和ES6加载
commonJs
commonjs通过module.exports或者exports来达到暴露对象
let { stat, readFile } = require('fs');
// 等同于:
let _fs = require("fs");
stat = _fs.stat;
readFile = _fs.readFile;
上面的代码实质是加载整个fs模块,然后去读取其中两个方法,这种加载行为是“运行时加载”,因为只有运行时才能获取对应对象
ES6
es6模块不是对象,而是通过export命令输出代码,通过import导入应用
import { stat , readFile } from "fs"
这情况就是在fs里面加载其中三个方法,其他不加载,属于静态加载,可以在编译时完成模块加载,效率要比commonJs高