JS，，，

typeSctipt

typeScript

1、JS
2、C、C++、java、javaScript
3、为什么用JS进行开发？
4、对dom节点增删改查
5、JS数据类型，存在哪里
6、获取元素的方法
7、判断数据类型
8、JS加载过程阻塞
9、ul li事件委托
10、事件捕获、事件冒泡(dom0级默认)
11、on事件和addEventlistener()方法
12、阻止默认行为、取消冒泡(点击子元素不想触发父元素的事件)
13、事件代理(委托)
14、call、apply、bind——改变this指向
15、typeScript
16、node.js
17、qs.stringify()、json.stringify()
18、JS对象的构造函数
19、JS事件的监听器的使用

一、JS

特点：1、弱类型语言
        强类型语言：java
		  int a=10;     
	      a="hello";
		  system(); //报错
        弱类型语言：js
		  var a=10;  //var，可变类型
	  	  a='hello';
		  console.log(a);  //hello	
     2、脚本语言：本身具有逻辑能力和行为能力
     3、解释型的编程语言：需要被js解析器解析执行
     4、从上到下按解析顺序依次执行：解析顺序、执行顺序
        console.log(a); //undefined
        var a=10;    
        console.log(a); //10
     5、大小写敏感
     6、面向对象：可以通过创建对象实现指定的操作
     7、事件驱动：对用户的响应是以事件驱动的方式进行的
        能响应键盘、鼠标以及浏览器窗口等事件
        当事件发生后，可能会引起相应的事件响应，执行某些对应的脚本

——目前web开发中不可缺少的脚本语言，js不需要编译即可运行，运行在客户端，需要通过浏览器来解析执行JavaScript代码
ECMAScript(核心JS)：构成了JS核心的语法基础(如何声明一个变量，如何使用循环)
Dom(Document Object Model)：文档对象模型
    通过dom操作页面中的元素，当页面被加载时，浏览器会创建一个dom，给文档提供新的逻辑结构
    借助dom提供的API，可增删改查任何节点；可以绑定事件(html和js进行交互)
     将html中的所有标签全部转换成JS对象访问
     四种分类：Document文档类、Element标签类、Comment注释类、Text文本类     
Bom：主要封装了哪些方法及作用，操作网页中的元素
     浏览器对象模型，描述对象之间层次关系的模型，由多个对象组成
     顶层对象是代表浏览器窗口的window对象，其他对象都是它的子孩子
——兼容性：核心js兼容性最好，dom和bom兼容性相对较差

dom和bom的区别？
dom：文档对象模型，用来获取或设置文档中标签的属性
     例如获取或者设置input表单的value值
bom：浏览器对象模型，用来获取或设置浏览器的属性、行为
     例如：新建窗口、获取屏幕分辨率、浏览器版本号等

能做什么：本地表单验证，减少服务器端压力 
        为网页添加动态功能
        对事件作出响应，可将JS设置为当某事发生时才会被执行，如页面载入或用户点击时完成          
		减少客户端等待时间，增加客户体验好感度	   	 

和Java的区别：JS在浏览器运行，Java可在各种平台上运行
            弱类型语言     强类型语言

二、C、C++、java、javaScript

C、C++：理论上可以做任何开发, 只要有合适的硬件驱动和API
       特点：效率高，基本上是编译语言里面效率最高的
            写起来最为复杂，开发难度大
            其他编程语言的基础       
C：开发底层模块(比如驱动、解码器、算法实现)
   服务应用(比如web服务器)
   嵌入式应用
C++：更适合比较复杂但又特别需要高效率的设施：
     大型游戏
     一些基础库
     大型桌面应用
     大规模, 高性能
     分布式要求的程序开发
java：具备一些很好的语言特性，有可移植性、可扩展性
      稳定，开源性好，具有自己的一套编写规范，开发效率适中，目前最主流的语言
      网页
      企业级开发
      普通应用软件
      游戏后台

PHP：超文本预处理器，是在服务器端执行的脚本(编程)语言，适合Web开发并嵌入html中，显示网页
Perl：文本处理

三、为什么用JS进行开发？

1、浏览器支持，最初就是由浏览器公司研发的
2、有基于对象的特点
   弱类型语言的特点
   ——语言的灵活性比较强

四、对dom节点增删改查

dom元素的增删改查

创建元素节点：document.createElement()
追加：appendChild

删除：removeChild

修改文本：innerHTML
修改属性：replaceChild()  

查询(相当于获取元素)：document.getElementsByTagName()

五、JS数据类型，存在哪里

基本数据类型和引用数据类型的区别

undefined，null，number，布尔，string——栈，按值传递，可以直接操作保存在变量中的实际值
object——在栈中存储引用地址，在堆中获取数据，按引用访问，只能操作对象在栈内存中的引用地址

1、声明变量时的内存分配不同：存储在栈中，也就是变量访问的位置
                        在栈中存储引用地址(大小是固定的)，在堆中获取数据(引用值大小会改变)
2、访问机制不同：可直接访问
               对象按引用访问
3、复制变量时不同：复制后两个变量是完全独立的，只是值相同
  把内存地址赋给新变量，两个变量都指向了堆内存中的同一个对象，其中一个改变会对另一个造成影响

六、获取元素的方法

——选出的元素是动态的
1、document.getElementById，返回节点对象
   document.getElementsByClassName，返回伪数组，通过下标获取该节点对象 进行操作
   document.getElementsByTagname，和上述方法一样
   document.getElementsByName：name属性值，和上述方法一样 
   
——选出来的元素是静态的，不会随文档操作而改变
  根据选择器获取元素
2、document.querySelector("选择器")：返回第一个匹配元素，返回节点对象
   document.querySelectorAll("选择器")：返回所有匹配元素，返回伪数组

七、判断数据类型

判断数据类型instanceof
typeof与instanceof，isPrototypeOf区别

八、JS加载过程阻塞

<script async="async">：脚本相对于页面其余部分异步执行(当页面继续解析时，脚本将被执行)  异步
<script defer="defer">：脚本在页面解析完执行  推迟

九、ul li事件委托

事件冒泡，给ul绑定事件 监听子元素的冒泡事件
接收事件对象

十、事件捕获、事件冒泡(dom0级默认)

事件类型
事件捕获、事件冒泡、事件代理

一、事件三要素
   事件目标：要控制的标签
   事件对象：调用事件处理程序时被创建，window自动封装的对象event(保存触发事件处理程序时的一些细节)
   事件处理程序handler：让它做的事情
            
   btns[0].onclick=function(event){
   }

二、事件捕获：根节点——>事件源（由外到内）进行事件传播
   事件冒泡：事件源 ——>根节点（由内到外）进行事件传播
——共同行为：事件传播


二、dom2级事件规定事件流：
1、事件捕获阶段：从外向内——解析 
2、处于目标阶段
3、事件冒泡阶段：从内向外——执行(click支持事件冒泡)	

点击目标元素后，不会马上触发目标元素的事件，而是先执行事件捕获
从根节点向内捕获到目标元素后
处于目标阶段时，触发元素事件
冒泡阶段，从目标元素逐步回到顶部

事件处理程序：dom2级增加了addEventlistener

十一、on事件和addEventlistener()方法

(dom0级事件、dom2级事件)

兼容性好
不能给一个dom对象绑定多个相同事件类型的事件(属性名相同就是重写)	
事件解绑：dom.ontype=null;

兼容性不好
可以给一个事件注册多个监听器(event，  function，     true捕获执行false冒泡执行，默认不写也行)
                        click  事件触发后调用的函数          在哪个阶段执行函数                    
可以给一个dom元素绑定多个相同事件类型的事件处理程序
可选择在捕获/冒泡阶段执行
事件解绑：dom.removeEventListener('type',handler,boolean);

十二、阻止默认行为、取消冒泡(点击子元素不想触发父元素的事件)

event.preventDefault();

在addEventlistener()函数内写event.stopPropagation();    ——W3C
                          event.cancelBubble=true;     ——IE

十三、事件代理(委托)

事件委托(代理)详解
原理：事件冒泡

把原本需要绑定在子元素的响应事件代理到父元素或更外层元素上，
真正绑定事件的是外层元素，
在执行事件时再去匹配判断目标元素，
当事件响应到需要绑定的元素上时(事件捕获)，
会通过事件冒泡机制从而触发它的外层元素上，然后在外层元素上去执行函数

好处：减少内存消耗，提高性能(只在内存中开辟了一块空间，不需要访问多次dom元素)
     新增子dom对象时，不用再进行事件绑定
缺点：如果所有事件都用事件代理，可能会出现事件误判

十四、call、apply、bind——改变this指向

call、apply、bind三者用法、区别

call和apply的区别：传参方式不同

bind：和call语法一样，区别在于立即执行还是等待执行
      返回一个新函数，再执行调用      

call：严格模式：不传参数、null、undefined——>window
      非严格模式：是谁就指向谁、不传参数是undefined

bind方式：let fn = function(a,b){
             console.log(this,a,b);
         }
         fn.call(obj,1,2);   
         fn.bind(obj,1,2); 
         
         //绑定的时候立即执行，当触发点击事件的时候执行的是fn的返回值undefined
         document.onclick = fn.call(obj);
         //bind把fn中的this预处理为obj，此时fn没有执行，当点击的时候才会执行fn
         document.onclick = fn.bind(obj);

十五、typeScript

typeScript百度百科

脚本语言/编程语言，兼容JavaScript，扩展了javaScript语法
增加了可选类型、类、模块
比javaScript进步的地方：加入注释，让编译器理解所支持的对象和函数，编译器会移除注释，不会增加开销
                      增加一个完整的类结构，使之更新是传统的面向对象语言
通过TypeScript编译器或Babel转译——>JavaScript，可运行在任何浏览器、任何操作系统                      

十六、node.js

nodeJS简介

相同点：都使用了Javascript这门语言来开发
       封装了谷歌V8引擎的JS运行环境

浏览器端JS：受制于浏览器提供的接口
          比如浏览器提供一个弹对话框的Api，那么JS就能弹出对话框
          浏览器为了安全考虑，对文件操作，网络操作，操作系统交互等功能有严格的限制，
          所以在浏览器端的JS功能无法强大，就像是压在五行山下的孙猴子。

NodeJs：完全没有浏览器端的限制，
        让Js有文件、网络、进程操作等功能
        和Java，Python，Php等语言已经没有什么区别了
        而且由于底层使用性能超高的V8引擎来解析执行、和天然的异步IO机制，让我们编写高性能的Web服务器变得轻而易举
        Node端JS就像是被唐僧解救出来的齐天大圣一样，法力无边

十七、qs.stringify()、json.stringify()

十八、JS对象的构造函数

ES6的constructor() 函数

ES6引入了class类的概念，创建的每一个class类，都会有一个constructor()方法，
该方法是一种用于创建和初始化class创建的对象的特殊方法--构造函数方法

使用extend必须使用super()——调用父类的构造方法

十九、JS事件的监听器的使用

对象的onclick事件发生时，只会执行最后绑定的方法
而用事件监听则不会有覆盖的现象，每个绑定的事件都会被执行