面试1
模拟面试老师问到的面试题
1.冒泡和捕获的差别
冒泡：从里到外
捕获：从外到里
举例：
div，body，html，doc
doc，html，body，div
2.继承 extends
1.原型链继承
function Parent1(){
this.name='parent1'
this.play=[1,2,3]
}
function Child1(){
this.type='child2'
}
Child1.prototype=new Parent1()//重要
console.log(new Child1())
缺点：child和parent两个实例使用的是同一个原型对象，他们的内存空间是共享的，一个发生改变，另一个也会改变，
2.构造函数继承（借助call）
function Patrnt1(){
this.name='parent1'
}
Patrnt1.prototype.getname=function(){
return this.name
}
function Child1(){
Parent1.call(this)//重要
this.type='child1'
}
let child=new Child1()
log(child)
log(child.getname())//报错
缺点：父类原型对象中一旦存在父类之前自己定义的方法，那么子类将无法继承这些方法。
只能继承父类的实例属性和方法，不能继承原型属性或者方法。
3.组合继承
4.原型式继承 Object.create 类似于浅拷贝
let parent4={
name:"amy"
friends["p1","p2"]
getname:function(){
return this.name}
}
let person4=object.creat(parent4)//重要
person4.name="tom"
person4.friends.push("jessy")
缺点:多个实例的引用类型属性指向相同的内存，存在篡改的可能，
5.寄生式继承
6.寄生组合式继承
3.src与href
href：1用在link和a 2是为当前文档和引用建立练习 3浏览器解析：识别为css，并行下载资源并且不会停止对当前文档资源的加载
src;1用在sc，img上 2是替换当前的元素 3 停止其他资源的加载，直接将该资源下载完毕，编译，执行
4.css位移
transform:translate(水平位移,垂直位移);
transform:translate(水平位移);
transform:translateX(水平位移);
transform:translateY(垂直位移);
默认情况: 正值 从上往下,从左往右
5.12px改成1px
使用transform: scale();属性缩放字体所在元素即可实现小字体显示
6.引用数据类型和基本数据类型的区别
基本数据：bool int float double byte short long char
引用数据：数组 字符串
基本数据保存在栈中，而引用数据类型只是地址保存在栈中，具体内容保存在堆中
7.表单事件
input select change invalid reset submit
8.！important
!important>行内样式>id>class|属性>标签>通配符；
9.语义化标签
h标签 strong标签 nav标签 p标签 ins del
具有可读性，使得文档结构清晰
浏览器便于读取，有利于优化，
利于团队开发和维护，
用户体验好
10.h5新增特性
语义化标签，增强型表单，新增表单元素，新增表单属性，音频、视频，canvas，地理定位，拖拽，本地存储，
11.css3新增语法
transtion animation transform 阴影 边框 text-shadow
12.es6新增语法
1.新的变量声明
let const
2箭头函数
3解构赋值
可以将属性/值从对象/数组中取出,赋值给其他变量。
4...运算符
剩余运算符 展开运算符
5模板字符串
反引号 ￥{}
6模块
导入import 导出export
13.事件代理
事件代理又叫事件委托，利用的是事件冒泡，事件要绑定很多事件，可以绑定给他的祖先
14.js
15.渲染过程
1先解析html文件，生成dom树
2在解析css文件，生成css规则树
3将dom树和css规则数结合，创建渲染树
4根据渲染树去布局和绘制
16.异步
异步（Asynchronous, async）是与同步（Synchronous, sync）相对的概念。
代码不按照代码顺序执行
17为什么说js是单线程的
1进程：cpu分配资源的最小单位
2线程：cpu调度的最小单位
3浏览器是多进程的
没打开一个页面，就是一个进程，所以浏览器是多进程的
4js是单线程的
js作为浏览器的脚本语言，主要实现用户和浏览器的交互以及操作dom，所以他只能是单线程的，举个例子，假如js是多线程的，当一个线程要修改一个dom元素，一个线程要删除这个dom元素，浏览器就会不知所措
18.新建dom节点
document.creatElement("div")
父元素.appendChild（）
父元素.insertBefore（新节点，谁的前面）
父元素.removeChild（）
19.防抖和节流
多次触发只响应最后一次
多次触发只响应其中几次
20.重绘和回流
影响元素的简单样式的改变，如颜色，字体等
影响元素的布局的属性，比如宽高
重绘不一定会引起回流，回流一定引起重绘
21.sass
SASS是一种CSS的开发工具
1 变量 以$开头
$blue:#111
div{
color: $blue
}
2 选择器嵌套 属性也可以嵌套
div h1{
color:red
}
可以写成
div{
h1{
color:red
}
}
border-color属性可以写成(冒号别漏掉)
p{
border:{
color:red
}
}
3注释 有三种
/**/ 保留在编译后的文件中
// 编译后被省略
/*! 重要注释 即使压缩编译 也会保留，通常用于版权信息
4 继承 允许一个选择器继承另一个选择器 @extend
.class2{
@extends .classs1
}
5 定义一个代码块 @mixin
使用@include命令 调用这个mixin
@mixin left{
float:left
margine-left:10px
}
div{
@include left
}
6 插入文件
@import命令，用来插入外部文件。
7 @if
p{
@if 1+1==2{color:red}
@if5<3{color:blue}
}
@if lightness($color)>30%{
bgc:#000
}@else{
bgc:#fff
}
8 for循环 while循环 each
@for $i from 1to10{
.border-#{$i}{
border:#{$i}px solid blue
}
}
$i 6;
@while $i>0{
.item-#{$i}{width:2em*$i;
$i:$i-2
}
}
9 自定义函数
@function double($n){
@return $n*2
}
22.this
1.方法调用，谁调用指向谁
2.函数调用 没有明确指向 指向window
3.构造函数 指向被构造的对象
4.apply call bind 指向第一个参数
5.箭头函数 指向上一层
6.严格模式下，没有定义，指向undefined
23.作用域链
每一个函数执行的时候，会先在自己创建的ao上找对应的属性值，找不到就往自己的父级的ao上面找，再找不到就再上一层的ao，知道找到最大的boss window
25.隔行变色
用 for循环，if判断，偶数是一个色，奇数是一个色
26.transform
1translate(x,y)
transform：translate(5px,5px)
2scale(x,y)
transform:scale(0.8,1)
3rotate(deg)
transform:rotate(45deg)
4skew(deg,deg)
transform:skew(30deg,30deg)
5rotateX() rotateY() rotateZ()
transform:rotateX(180deg)
6 perspective
27.link与script区别
引入css样式
引入js
