老三样的一些考点

一、new 一个新对象的过程
当我们new一个构造函数的时候，得到的实例继承了构造器的构造属性（this.name等）以及原型上的属性

大体上是4步走
1.创建一个空对象 var obj = {}
2.设置新对象的constructor属性为构造函数的名称，继承函数的原型
3. 使用新对象调用函数，函数中的this被指向新的实例对象
4.将初始化完毕的新对象地址保存到等号左边的变量中

二、css页面的优化方案
1.减少css样式嵌套
2.多使用公共样式类
3.减少通配符的使用
4.减少使用表达式（例如定时改变背景颜色的语句）
5.缩写margin-left等为margin

三、Vue的组件通信
1.父子传值
props和$emit

2.$emit $on
通过一个空的Vue实例作为中央事件总线，用它来触发事件和监听事件，可以做到父子、兄弟、跨级

定义一个空的实例
var Event = new Vue（）

在需要传出去的对象的methods方法中定义一个 Event.$emit（‘data+a’,this.name）

在需要接收值的对象的mounted（）中添加 Event.$on(‘data-a’,name => {
this.name = name
}

3.Vuex
一个单项数据流，在全局拥有一个State存放数据，通过mutations

4.ref

就是在子组件添加一个ref属性，然后在父的生命周期回调函数mounted中定义一个变量赋值为this.$refs.xx， xx为ref属性的值

5.$attrs / $listeners

6.provide/inject
在父组件中添加provide{ 属性名：属性值 }
在子组件使用inject：[属性名] 然后就可以通过this调用了

四、浏览器运行js的过程

放在body的尾部是因为他会阻塞渲染

js是单线程，浏览器是多线程
js不能创建线程，不能开展并行任务，不能对线程操作

心得：
浏览器渲染就是五步走，htmlDOM树，css的CSSOM树，合并渲染书，计算节点位置，渲染到屏幕
css文件和js文件都会引起阻塞，这是因为css和js中的内容可能会改变最终结果，所以必须阻塞
但这种阻塞并不影响DOM解析，也不会影响浏览器对外部资源做的预处理
css的阻塞是指link引入的文件css，而不是style标签中的，后者是html解析器解析的
其实浏览器在不断的进行渲染

可能会引起回流的，基本都是关于尺寸布局修改，颜色样式之类的只会引起重绘
1.页面首次渲染
2.浏览器窗口大小发生变化
3.元素尺寸或位置发生变化
4.元素内容变化
5.元素字体大小变化
6.添加或删除可见的DOM元素
7.激活伪类
8.设置style属性
9.查询某些属性或者调用某些方法

五、 == 的终章
首先五个基本数据类型：undefined，null，String，Boolean，number

1.undefined == null //true
2.undefined，null和其他类型值比较都是输出 false
3.String，number，Boolean比较的时候都转换成数字再比较
4.当对象类型和string，Boolean，number比较的时候
先调用对象的valueOf方法，如果返回一个原始类型的的值，则会用该值与之比较，否则执行下一步
调用tostring方法，如果返回一个原始类型的值，则会用该值与之比较。否则两个不等

注：
undefined
null
-0
+0
NaN
‘’（空字符串）
这及格转化布尔值为false，其他都是true

所以[ ] == ![ ] 会成立，顺序是 => [ ] == false => 0 == false
!把目标变成布尔值 把[ ]变成了0（如果是{ }，是转换成NaN，他并不是数字）

六、src和href的区别

在html引入css

<link href = "路径 " rel = "stylesheet" type = "text/css">

在html引入js文件

<script src = "路径" type = "text/javascript">

href全称Hypertext Reference，超文本引用
在加载它的时候，不会停止对当前文档的处理，浏览器会继续往下走。常用在a、link标签

src是source的缩写
表示对资源的应用，它指向的内容会嵌入到当前标签所在的位置，由于src的内容是页面必不可少的一部分，因此浏览器在解析src时会停下来对后续文档的处理，直到内容加载完毕。经常用在script、img、iframe标签中

总的来说，link是表示引用关系，而src更像是用引用的资源直接替代当前标签，并且会阻塞

另一个css
兼容性差，属于css范畴，页面完全载入后才会加载，前面的那个是同时加载的

<style type="text/css">
@import + 空格 +url(外部css的路径)
</style>

七、bind的实现
bind和apply，call的区别就在于他是创了一个新函数，不会直接调用，而call是直接调用的

 Function.prototype.bind = function () {
	        var self = this,                        // 保存原函数
	        context = [].shift.call(arguments), // 保存需要绑定的this上下文
	        args = [].slice.call(arguments);    // 剩余的参数转为数组
	        return function () {                    // 返回一个新函数
	            self.apply(context,[].concat.call(args, [].slice.call(arguments)));
	        }
	    }			
				
				

八、解释性语言和编译性语言

编译性语言
只要编译一次就可以把源代码编译成机器语言，后面的执行无需重新编译，直接使用前面的编译结果，执行的效率很高
缺点：依赖编译器，跨平台性差

解释性语言
源代码不能直接翻译成机器语言，而是先翻译成中间代码，再由解释器对中间代码进行解释运行
程序不需要编译，程序在运行的时候采访一层机器语言，每次执行都需要重新翻译
python，js，shell
效率低但是跨平台性强

九、webSorket

Socket是传输层的协议

Websocket是应用层的协议，在单个TCP连接上进行全双工通信的协议。
他实现了服务器端主动向客户端发送请求，可以替代麻烦的持续轮询来保证最新的信息变化。
只需要一次握手

和http的区别，http不支持持久性的连接
websocket是一个持久化的协议
都是应用层协议，依靠下层传输层的TCP
但都是用的是http请求，只不过后者websocket在请求头和响应头里面都有特殊字段，告诉浏览器和服务器协议转换

十、josn

json全程JavaScript Object Notation 一种轻量级的数据交换格式，采用完全独立于语言的文本格式，是理想的数据交换格式
在js中处理josn数据不需要任何特殊的api或者工具包

在josn中，两种结构
对象和数组

1.对象
var person = {“name”:“Liaz”,“number”:“152”};

一个对象以 { 开始， } 结束，“key/value”之间使用逗号隔开

2.数组
var person = [ {“name”:“Liaz”,“number”:“152”}, {“name”:“Liayhz”,“number”:“785”}];

数组式值的有序集合。[ 开始 ] 结束 中间逗号分开

---

josn对象和josn字符串之间的转换

字符串

var jsonStr ='{"name":"Liza", "password":"123"}' ;

字符串比对象最外层多了单引号

对象

var jsonObj = {"name":"Liza", "password":"123"};

---

字符串转换成对象

var q = JSON.parse§;
var q = eval(’(’+p+’)’)
var q = (new Function("return "+p))(); 就是这三种，第一种对字符串更严格点 具体用的时候是三个参数，第二个是null，第三个才是数字

对象转换成字符串

var jsonstr =JSON.stringify(jsonObject );

转换成字符串的方法还有一个可选参数space，可以指定缩进格子，填数字

---

josn字符串替换
其实就是用正则

var jsonstr = josnstr.replace（new RegExp（'\\"',"gm"）,'"'）

---

遍历josn对象和json数组

遍历对象 直接for in

var packJson  = {"name":"Liza", "password":"123"} ;
 
for(var k in packJson ){//遍历packJson 对象的每个key/value对,k为key
   alert(k + " " + packJson[k]);
}

遍历数组

var packJson = [{"name":"Liza", "password":"123"}, {"name":"Mike", "password":"456"}];
 
for(var i in packJson){//遍历packJson 数组时，i为索引
   alert(packJson[i].name + " " + packJson[i].password);
}

name这里都成了他的属性，而遍历对象的时候，name这些都算是他的键key

josn读内部属性的时候可以用“.”的形式像访问属性一样访问，也可以用"[ ] "的形式访问，数字好像只能用后者