js知识点总结
js执行前,浏览器会给一个全局作用域window
window分两个模块 一个存储模块 一个执行模块
存储模块 找到所有的var和function关键字 给这些变量添加内存地址
执行模块 代码从上到下执行 遇到变量就回去存储模块查找 有和没有
有,就看你赋值没有 赋值了就是后面的值 没有赋值就是undefined
如果没找到 结果就是xxx is not defined
作用域:是浏览器给js的一个生存环境(也叫栈)
作用域链:
函数内部的变量被使用时,首先会在自己的私有作用域下查找是否有这个变量,
有就直接使用,没有就会向他的上一级查找,父级就使用父级的,父级没有就会以此继续向
上查找直到window为止,window有就使用没有就is not defined。这种查找机制我们叫作用域链。
原型链
Duixiang.shuxing的时候 首先看这个属性是不是私有的 私有的就直接使用
如果私有的属性没有 就找公有的 公有的有就使用 没有就按照__proto__找他
的类上有没有 直到找到基类object 如果object没有就undefined了 这种查找机制
叫原型链
原型
1)首先类身上天生自带一个prototype的属性 属性值是对象
2)prototype 对象天生有一个constructor属性 属性值是类本身
3)实例天生有一个__proto__指向自己类的原型
变量
可以改变的量 往往用英文字母代替变量 并且区分大小写
变量其实就是一个容器 起到临时存储数据的作用 通过等号赋值
基本数据类型:undefined string boolean null number
引用数据类型:object array function
二者的区别:
基本数据类型就是简单的操作值
引用数据类型会开辟一个新的内存空间把内存空间的地址赋值给变量
this
this是js的一个关键字 指定一个对象然后去替代他 分两种情况
函数内的this和函数外的this 函数内的this指向行为发生的主体 函数外的this都指向window
函数内的this跟函数在哪定义没有关系只跟执行时的主体有关 带“.”的主体就是.前面的 不带.
就是window 找主体的时候就看这个函数(方法) 带不带“.”如果函数和方法执行了带“.”那么this
就指向“.”前面的对象 如果不带“.”就指向window
自执行函数里面的this和定时器的this 都指向window 事件里面的this指向触发事件的元素
构造函数里的this指向他的实例
堆内存:就是存放代码块的 存放形式有两种 一种是对象以键值对的形式存放
另一种就是函数 以字符串的形式存放
栈内存:函数执行的时候首先会开辟一个新的内存空间叫 栈内存(环境或作用域)
闭包
函数在调用的时候会形成一个私有作用域 内部的变量不会被外面访问 这种保护机制叫闭包
面向对象(在js里就是构造函数)
通过函数封装得到一个类 通过类可以实例出他的子对象 子实例对象有自己私有属性
也有可继承的属性 判断子实例的属性是公有还是私有 在自己里面的属性是私有的 可继承
的是公有 而子实例对象在操作自己属性的时候 首先判断属性是私有的还是公有的 私有的
直接使用 公有的按照原型链__proto__向上查找
面向对象重点:类 原型 原型链 封装 继承
封装:减少代码冗余
继承:减少内存消耗 重复使用的代码写一遍就行了
多态:
目的:生成一些具有功能的对象 一个叫属性一个叫方法
基类object的子类
Function Array Number Boolean String Date Math RegExp
函数 数组 数字 布尔 字符串 日期 算数 正则 (都是类 本质都是函数)
null和undefined的区别
null和undefined都表示没有值
null 是这个东西存在但是没给值
undefined 这个东西压根就不存在的 是人为定义的
DOM回流
页面渲染时 我们对html结构简单的增删查改时 浏览器会对所有的DOM进行重新排列 就叫DOM回流
严重影响浏览器的性能
事件冒泡
当给父子元素的同一事件绑定时 触发了子元素身上的事件 执行完毕之后 也会触发父级元素的相同事件
这种传播机制叫事件冒泡
事件捕获
给父子元素用addEventListener( )绑定同一个事件时 当触发子元素身上的事件 会先触发父元素身上的事件
然后在传递给子元素 这种传播机制叫事件捕获
DOM2级中标准浏览器和非标准浏览器的区别
①写法 标准:addEventlistener 非标准:attachEvent
②前者指向触发事件的元素 后者指向window
③前者不带on 后者带on
④attachEvent只用在ie8以下 addEventlistener只用在标准浏览器下
⑤attachEvent只有冒泡没有捕获 addEventlistener有冒泡也有捕获
DOM0级和DOM2级的区别
①DOM0级如果绑定多个相同的事件 后者会覆盖前者 dom2级不会
②DOM0级只适合普通事件 DOM2级还有指定的事件类型
如DOMContentLoaded(当html文档结构加载完成之后执行)这个事件就是jquery中的$(document).ready()
③事件取消DOM0级直接赋值null就ok了 DOM2级事件需要使用div.removeEventListener( )
事件绑定的两种写法
dom0级 div.onclick=function(){}
dom2级 addEventlistener('click',function(){},false)
事件对象event
当用户触发一个事件时 浏览器所有详细情况都存在一个叫event的对象上 我们把他叫事件对象
参数对象arguments
每一个函数都有一个参数对象 他是这个函数所有参数构成的集合
阻止事件冒泡的兼容性解决方法:
event.stopPropagation?event.stopPropagation():event.cancelBubble=true;
阻止事件默认行为兼容性写法:
event.preventDefault?event.preventDefault():event.returnValue=false;
捕捉事件源的兼容性写法
var target = event.target || event.srcElement
事件委托
如果子元素身上绑定大量相同事件的时候 我们尽量采用事件委托 所有子元素把自己的事件委托给了父级