javascript

 var a1=[1,3,4,"dhsf",true];
   console.log(a1);
// 全局作用域中的全局对象window
console.log(window)
// 文档节点document 它是全局对象的属性 但是本身也是一个对象
console.log(document)
// 使用文档节点对象的方法，可以找到页面中的DOM元素
console.log(document.getElementsByTagName("button")[0])

回调函数

检查

属性可以是任意类型，使用in检查属性语法： "属性名" in 对象自身没有但是原型对象中含有该属性，会返回true
检测对象本身是否含有属性：对象.hasOwnProperty("属性名")
检查对象是否是某个类的实例：对象 instanceof 类

this

当以函数的形式调用时，this就是window
当以方法的形式调用时，谁调用谁就是this
当以构造函数的形式调用时，就是新创建的那个对象，所以可以使用点来添加它的属性。
调用call apply时，this就是指定的那个对象。可以用来改变this

特殊方法

call apply 都是函数对象的方法：均调用函数执行 fun();fun.apply();fun.call();这三者是等价的

调用他们可以将一个对象指定为第一个参数，此时该对象是函数执行的this,而不是我们定义的window

call方法可以将实参在对象(第一个参数)后依次传递，apply需要把实参封装到一个数组中进行传递

arguments是一个类数组对象（伪数组），可以通过索引操作数据，同样可以获取长度
调用函数时，我们的实参会在arguments中保存，不定义形参。可以直接使用实参,arguments[0]代表第一个实参。里面有一个属性callee，这个属性对应一个函数对象，就是当前正在指向的函数的对象。
在调用函数时，浏览器每次都会传递两个隐含的参数，函数的上下文对象this 封装实参的对象arguments
可以定义形参，直接使用arguments[i]

function  sum(){
for (let index = 0; index < arguments.length; index++) {
console.log(arguments[index]) 
//10,20,30,40
}
}
sum(10,20,30,40)

eval()：执行一段字符串形式的js代码

函数调用（执行）：注意this的不同

直接调用函数对象()
通过对象调用对象.函数名()
通过new调用
通过apply/call 函数名.call(对象名)

js代码的位置

写在标签中的事件中，可是这样造成结构与行为的耦合，不便于维护。
可以将js代码写在a标签中的href属性中，这样当当点击超链接时会执行js代码。需要使用javascript:开头
js的代码是写在html中的，所以需要以""中标记，属性值为type=text/javascript
可以将js代码编写到外部文件中，使用script标签的src属性引用进来。优点：不同的文件均可以导入文件，而且可利用浏览器的缓存机制。

注意:script一旦引入外部文件，不会再执行其他js代码。

作用域与函数作用域

作用域指的是一个变量起作用的区域。js中没有块级作用域，就是除了函数作用域，所有花括号里面的变量就是全局变量。

全局作用域：

直接编写在script标签中js代码，都在全局作用域
全局作用域在页面打开时创建，关闭时销毁
全局作用域中有个全局对象window 它代表浏览器的窗口，由浏览器创建，可以直接使用
在全局作用域创建的变量都是window对象的属性，函数都是window对象的方法

函数作用域(局部变量)
定义形参就相当于定义了函数作用域中声明了变量

隐式全局变量：在函数中（js），不使用var声明的变量是全局变量

调用函数时创建函数作用域，函数执行完毕，作用域销毁
每次调用一次函数，就会创建一个新的作用域
在函数作用域中是可以访问全局作用域里面的变量的，但是全局作用域的变量是不可以访问函数作用域中的变量的
当在函数作用域操作一个变量时，他会先在自身的作用域寻找是否有变量，然后再去上一级作用域寻找，直到全局作用域，如果全局作用域仍没找到，就会报错。referenceError
在函数作用域想要访问全局变量。可以使用window对象来定位

类型

数据类型：字面量类型： Number String BoolLean Undefined Function Object
null是object类型的未定义变量时undefined类型的
Null 中只有null一种取值表示是一个空对象
Undefined中只有undefined 变量定义为未赋值就是undefined

类型转换

转换为string

1）使用ToString()方法，但是null与undefined类型没有该方法，不会影响原数据。
2）调用String函数 null 转换为null undefined转换为undefined
3）+""

转换为number

js中所有的数字都是number
Nuber.Nax_Vaule
Infinity
-Infitity
NAN Not A Number
如果字符串是纯数字，则转换为对应的数字
如果字符串有非数字，转换为NAN
如果字符串是空或者全是空格的字符串，转为数字0
布尔：
true:1 false:0
undefined转换为NAN
null转换为0
调用Number()函数
调用parseInt(sting,进制数) 专门针对字符串；将字符串中的有效的整数内容取出来，然后转换为Number A=1234PX" 同理还有 parseFloat
如果非string进行操作那么会将其先转换为string之后运算
/1 -0 *1 取+

转换为Boolean

数字：除了0 NAN 都是true
字符串：除了空串都是true
对象：true 这里就有包装类的特殊情况
var b=new Boolean(false)；
if(b)
{
console.log("对象转化为布尔值都是true，所以会执行")
}
null undefined:false
对对象取两次反：转换为布尔值

运算符

+：任何事物与字符串都会自动转换为字符串，相加都是拼接
任何做- * /都会转换为数字：可使用任意值-0 *1 /1来转换为number -:会先转换为数字然后再进行计算
自增（i++;++i）其中i都会加一，不做改变时表达式的值
逻辑[针对布尔值] （$ | ! ）（|| &&）
非布尔值的逻辑运算：会先转换为布尔值然后在运算并且返回原值
与：如果第一个值是true,则返回第二个数值
如果第一个值是fause,返回第一个值
或：
如果第一个值是true,返回第一个值
如果第一个值是fause,返回第2个值
关系运算符：返回布尔值：注意没人可以必过NAN 字符串比较的是字符编码，字符是一位一位比较的
比较两个字符串，可能得出错误结论
在字符串使用转义字符输入unicode编码"\u四位16进制"
在网页中使用$#编码
等于：NAN不等于任何数值，包括它自己会转换为相同数据类型后在比较
全等 ===不会做自动转换而等于会做自动转换

流程控制语句

条件判断语句
几种if：if只能控制紧随其后的语句，if语句中只执行一句。
条件分支语句
switch case :没有break就会执行满足条件的之后的。
循环语句

对象（复合数据类型）引用

与基本数据类型不同，基本数据类型的数值都是存储在栈空间的，数值之间是独立存贮，修改并不会互相影响。
而对象是存储在堆空间的。每创建一个对象，都会在堆内存开辟一段空间存储对象，变量保存的是对象的地址，如果两个变量保存同一个内存地址，说明指向同一对象，但是它们并不相等。修改其中一个变量的属性，另一个变量必然受到影响。在栈空间存储的是对象的地址，这个地址指向堆空间存储的对象

字面量：永远不会改变的值。变量直接保存字面量，并且数值可变。使用var声明，记得赋值

内建对象
ES标准定义的对象。任何浏览器都有可以使用 MAth Function String
DOM 对象
由js运行环境提供的对象，主要是浏览器提供的对象比如 DOM BOM
自定义对象 :LW自己定义的对象(引用数据类型堆里存地址)

1.1 对象属性

读取：对象名.属性
如果不存在，不会报错，会返回undefined
修改：对象名.属性=值
删除：delete 对象.属性

特殊的属性：对象["属性"]=值同样需要使用该方式读取 []可接受变量
属性的值可以是任何类型

如果对象中不含有这个属性，访问的话会返回undefined，并不会报错
删除：delete 对象.属性
1.2 使用 for in 遍历对象属性
for 变量 in 对象
对象有几个属性，这里就会循环几次，每次会把属性名赋值给变量。想要输出属性值。使用对象[变量]
1.3 属性可以是任意类型

1.2 创建对象

方法1:使用New关键字调用构造函数，构造函数就是专门用来创建对象的。

var 对象=new Object();
只能动态给空对象新增属性,使用对象.属性=属性值

方法2：使用字面量创建，可以直接赋值

          var 对象名={属性：属性值，属性名：属性值}
          可以在创建的时候同时添加属性，使用：
          注意如果是特殊的属性，属性也需要加括号

var obj = {}; // 相当于var obj = new Object()
// 2.动态给空对象新增属性
obj.name = "lnj";
obj.age = 33;
或者定义时赋值‘
var obj = {
    name:"lw",
    age:12,
    say : function () {
        console.log("使用字面量1"+"hello");
    }
    };

方法3：使用工厂函数

function 函数名(形式参数){
    创建一个新对象
    var xx=new Object();
    像对象中添加属性
    对象.属性=属性值；
    对象.方法=function(){
        函数体
    }
}

方法4：使用构造函数（使用new关键字）：因为工厂函数的构造函数一直是object,所以创建的对象的类型都相同。

构造函数与普通函数的不同在于调用方式，构造函数使用new关键字来调用。

所谓的调用就是函数的执行

1.立即创建一个新的对象
2.将新建的对象设置为函数中的this
3 逐行执行函数中的代码

将新建的对象作为返回值返回
使用一个构造函数创建的对象，我们称为一类对象，所以也称构造函数为类。

函数

函数就是一系列语句的集合。只有函数式可以执行的，其他的数据时不可以的。
使用函数提高了代码复用，提高了使用效率

创建函数（对象）

1 将函数要实现的代码以字符串的形式传递给构造函数：

   var fun=new Function("console.log('这是我传递的字符串')"）

   封装的代码不会立即执行，会在函数调用的时候执行  对象（）

2 使用函数声明来创建函数

        function 函数名（形参）{语句}

3 使用函数表达式创建函数(匿名函数)

就是使用赋值符号。

          var 函数名=function(){}

这是一个立即执行函数：函数定义完，立即被调用，一般只执行一次

注意

如果函数作为对象的属性：我们称为方法。
fun();调用函数，相当于使用函数返回值
fun; 使用函数对象
break：退出当前循环
continue:跳过当次循环
return:退出函数
注意：

各个对象的函数是相同的，浪费内存，将其在全局中定义，但是污染了全局作用域的命名空间，而且不安全。使用原型对象解决这个问题

原型对象

我们每创建一个函数时。解析器都会给函数（对象）添加一个属性prototype,这个属性对应着唯一对象，这个对象就是原型对象。当函数使用构造函数调用时，它所创建的对象会有一个隐含属性指向该构造函数的原型对象，通过使用proto来访问该属性。原型对象就是类中的公用区域，所有对象都拥有原型对象中拥有的属性。就是我们访问一个对象的属性时，他会首先在自己的属性中找，如果有直接使用，不再寻找。找不到去原型对象中找，直到原型为object。所以创建构造函数时，将对象共有的属性与方法写原型对象中（prototype）。
myaa.protype.a 原型对象中添加属性

所以我们创建构造函数时，可以讲对象共有的属性以及方法添加到构造函数的原型对象中。这样不用给每个对象添加，而且不会影响全局作用域。还可以使得所有对象都拥有属性与方法。

当我们打印对象时，实际调用的是它的tostring方法，不想输出[object object]。可以给对象重定义tostring方法

参数

调用函数时，实参传递给形参，浏览器不会检查实参的类型与数量，如果实际参数少，则会有undefined的形参。
简化的参数传递：
如果形参的参数过多，可以定义一个对象（属性为这些参数）,将该对象作为实参传递给函数，这时形参可以简写为任意东西X，函数体中使用X.属性
函数作为参数,此时函数叫做回调函数

function f1(fn) {
        fn();
           console.log("haha") ;
        }
      function f2(){
          console.log("xixi")
      }
      f1(f2);
//xixi haha

形参过多时，可以使用对象作为实参，且参数没有顺序限制。

  function person1 (o){
   console.log("我叫"+o.name+"我今年"+o.age+"我是一个"+o.sex)
 }
 var obj ={name:"lw",age:18,sex:"female"};
 console.log(person1(obj))

返回值

return：任意数据类型
一个函数有return 就有返回值
一个没有return 就没有返回值
一个没有return 就没有返回值，在调用时接收了，那么就是undefined
当函数调用后，需要这个返回值，就定义一个变量接收它
在函数中return后的语句都不会执行，函数不写return就会返回undefined 写了return没有参数函数调用之后还是undefined

垃圾回收

我们做的就是把不使用的对象设置为null

数组

数组[索引] 读取不存在的索引不会报错会返回undefined
像数组的最后一个位置添加元素：arr[arr.lenth]=数值
数组中的元素可以是任意类型 var arr=new Array(10,"hello",null,undefined,{name:"jj"}，function(){alert("hello")})
重要的属性：length 可以修改：若长度大于原有的，多出来的会空闲，若短，会删除。

创建数组

字面量
var 数组=[];可以同时指定数组的元素值
使用构造函数
var 数组=new Array();
同时也可以定义数组值，作为函数的形式参数

   var a1=[1,3,4,"dhsf",true];
    var a2=[];
    var a3=new Array();
    var a4=new Array("Saab","Volvo","BMW");

区别（一个参数的时候）
var a;
a=[10];元素是10
arr=new Array(10) 数组长度是10

数组常见的方法

1. push :在数组的末尾添加一个或者多个元素，并返回新数组的长度
2. unshift：数组的起始添加一个或者多个元素，并返回新数组的长度（其他元素索引会改变）
3. pop:该方法是删除数组的最后一个元素，并返回删除的元素。
4. shift:该方法是删除数组的第一个元素，并返回删除的元素。
5. slice:从数组中抽取元素，不改变原数组，将抽取的封装到新数组中，然后返回该新数组。参数：截取的数组的开始下标，截取的数组的结束下标
6.slice:抽取想要的元素   参数就是抽取的区间信息
语法：截取的新数组=slice[截取的数组的起始下标，截取的下标的数组结束下标)
注意：方法并不会改变原数组,注意索引的包含关系，而且第二个参数可不写,截取第一个参数以后的,同样索引也可以是**负数**，从后向前面计算 -1：倒数第一个。
7. splice：删除数组，会影响原始的数组,原数组只剩删除的部分，返回值是显示删除的部分，相加为原数组。
被删除的元素=splice(开始位置的索引，删除的个数,想要插入的元素：出现的数组的最前面)

数组的遍历：将数组元素全部取出来

1.使用for循环

使用forEach方法（IE8以及IE8以下的浏览器不支持该方法）
该方法接收一个函数作为参数，也就是函数名，一般我们会传递一个匿名函数，这个函数由我们创建但是并不由我们调用，称做回调函数。
浏览器会在浏览器中传递三个参数，
第一个：当前正在遍历的元素
第二个：当前正在遍历的元素的索引
第三个：当前正在遍历的数组
arr.forEach(funtion(value,index,arr){console.log("value="+value)})

js通过dom来对文档进行操作只要理解dom就可以随心所欲操作web页面
DOM :文档对象模型
文档：整个HTML文档
对象：网页中的每一部分都转换为对象
模型：使用模型来表示对象之间的关系方便获取对象就是一棵树（dom树）

变量提升

先提升变量，在提升声明
变量的提前声明：使用var关键字声明的会在代码执行前被声明，不使用var则不会提前声明，但是只是在当前作用域提升，并且提升到最前面
函数声明，会被所有代码执行前创建，所以可以在函数声明前调用该函数
函数表达式，不会提前

节点：构成html文档的最基本单元（Node）

标签(元素)节点属性节点(id name type) 文档节点（html）文本节点（标签中的文本内容）
元素：整个的元素，其中包括属性节点文档节点
节点的属性：
文档节点：nodeName:#document nodeType:9 nodeValue:null
元素节点：nodeName:标签名 nodeType:1 nodeValue:null
属性节点：nodeName:属性名 nodeType:2 nodeValue:属性值
文本节点：nodeName:#text nodeType:3 nodeValue:文本内容
window对象

调试

在source中进行调试

获取元素节点

getElementById：id属性一个
getElementsByName:name属性一组类数组对象
getElementsByTagName：标签属性一组
querySelector：主要字符串的选择器总会返回唯一的元素如果有多个，也只是返回第一个
querySelectorAll：符合条件的元素会封装在一个数组中返回尽管只有一个

获取元素节点的子节点

childNodes:所有子节点包括文本节点在内的所有节点
firstChild
lastChild

获取父节点以及兄弟节点

parentNode
previousSibling
nextSibling

属性

innerHTML:自结束标签没用，获取元素内部的html代码
innerText:获取元素内部的文本属性

获取body的内容

document.body 保存的是body的引用
document.all 代表所有元素
document.element

事件（onxxxx）

就是文档或浏览器窗口中发生一些特定的交互瞬间，js与html之间的交互是通过事件实现的

定义事件用户与浏览器的交互行为

直接在事件对应的属性中设置一些js代码，当事件被触发时，会执行代码。但是会存在结构与行为的耦合，不方便维护。

为事件绑定对应的响应函数，当事件被触发时，函数可以被调用执行，这里可以不可以为一个元素绑定多个事件，后面的会覆盖前面的呦



1. 使用script标签
2. 获取对象
3. 绑定事件

使用addEventListener方法为元素绑定响应函数

参数1：需要执行的事件，事件并没有ON前缀
参数2：事件触发时执行的回调函数
参数3：需要一个布尔值来确定是否在捕获阶段获取事件一般是false
相比直接绑定，可以绑定多个事件，this 是绑定事件的对象
元素.addEventListener();
缺陷：不支持IE8以及以下的浏览器
使用 addEvent()
参数1：需要执行的事件，事件有ON前缀
参数2：事件触发时执行的回调函数
区别：与addEventListener执行结果相反后绑定先执行 this 是window

兼容this与事件绑定定义函数为指定元素绑定响应函数

obj：要绑定事件的对象
eventStr:事件的字符串
callback：事件的回调函数
function bind(obj，eventStr,callback){
    if( obj.addEventListener)
    //普通浏览器
    {
           obj.addEventListener(eventStr,callback,false);
    }
 
    //IE8以及以下
    else{
          obj.addEvent("on"+eventStr,callback)
    }
  

}

事件注意事项

当事件被触发时，函数可以被调用执行，这时浏览器会将一个事件对象作为实参传递给函数，该对象包含了该事件的常用属性，比如鼠标的坐标 shift元素是否被触发
但是ie8及其以下的浏览器是不支持该对象的，它是将其封装在window对象的属性中的，假设对象为event 一般使用event=event||window.event来实现兼容
if(!event){event=window.event} 如果不存在？？null

onload事件

事件是在页面加载完成之后才会触发一般WWIwindow绑定一个onload事件

事件的冒泡

事件的冒泡就是事件的向上传导，当后代元素上的事件被触发时，其祖先元素的相同事件也会被触发。
取消冒泡：将事件对象的cncelBubble属性设置为true

事件的委托

指将事件统一绑定给元素的共同的祖先元素，然后当后代元素上的事件被触发时，会一直冒泡到祖先元素，从而指向祖先元素的系响应函数来处理事件。
事件委托利用了事件冒泡，通过委托，减少了事件的绑定次数，提高了程序的性能。

事件的传播

微软：事件由内向外传播即事件冒泡
网景：事件由外向内传播
W3C综合两个公司，将事件传播分三个阶段
捕获阶段：

在捕获阶段时由最外层的祖先元素，想目标元素进行事件的捕获，但是默认不会触发事件
目标阶段：
事件捕获到目标元素，捕获结束开始子啊目标元素上触发事件
时间冒泡：
事件从目标元素向它的祖先元素传递，依次触发。
如果希望在捕获阶段触发事件，可以addEventListener的第三个参数设置为true，一般我们并不希望在捕获阶段触发事件，IE8以及以下没有捕获阶段

json

js就是一个特殊格式的字符串，这个字符串可以被任何语言识别，
并且可以转换为任意任意语言中的对象
json中的js对象的格式相似，只不过json中额属性名必须加引号
json分类：
数组[]
对象{}
json中允许的值：字符串数值布尔值 null 对象

将json字符串转换为js对象：JSON类
JSON.parse()
js对象转换为json字符串
JSON,stringify

类



    
        
    
    类的定义及其对象

几种对象

Date对象

var date =new Date() 会获得当前时间

获取指定时间:参数中指定月/日/年时: 分: 秒 var date =new Date()

gettime():是获取当前时间时间戳距离格林威治时间(1970 1/1 0:0:0)所花费的毫秒数
Math对象

math 对象鱼其他不同。不是一个构造函数，它属于一个工具类不用创建对象。它里面封装了数学运算的相关属性以及方法。

Math.random():生成 0-1的随机数

Math.round(Math.random()*x):生成 0-x的随机数

Math.round(Math.random()*(y-x))+x:生成 x-y的随机数

以下三个是js的包装类

3.String对象
可以将基本数据类型转换为String对象
var s=123;
s.tostring()
发现s是基本数据类型，是不可以添加属性与方法，但是这里确实可以，
这是因为对基本数据的数值调用属性以及方法时，浏览器会临时使用包装类将其转化为对象，然后调用对象的属性与方法，调用结束，会转换会原来的数据类型

底层字符串是以数组的形式保存的，所以可以使用下标
4.Number对象
可以将基本数据类型转换为Number对象
5.Boolean对象
可以将基本数据类型转换为Boolean对象

修改样式

样式的优先级：

1.就近原则

2.理论上：行内>内嵌>链接>导入

3.实际上：内嵌、链接、导入在同一个文件头部，谁离相应的代码近，谁的优先级高

行内的样式

元素.style.样式名=样式值

原来css的样式含有-，修改为驼峰命名。font-size 改为fontSize
如果为样式添加！important此方法就会失效
之中方式为属性设置内联样式
当前的样式(IE)

元素.currentStyle.样式名=样式值

若是元素没有设置样式，获取其默认值。

其他浏览器:getComputedStyle属于window

元素.getComputedStyle.样式名=样式值
参数1：获取对象的元素
参数2：伪元素 null
返回对象，封装了修改过的样式
如果元素的属性为设置，并不会返回默认值，而是返回实际值。
比如div未设置宽，那么就会显示实际的宽(数值)，而不是currentStyle的anto
设置所有浏览器兼容的方式：

function getStyle(obj，name){
    if( getComputedStyle)
    //普通浏览器
    {
         return getComputedStyle(obg,null)[name];
    }
 
    //IE8以及以下
    else{
        return obj.currentStyle[name];
    }
}

正则表达式（定义字符串的一些规则)

计算机根据正则表达式，判断字符串是否符合规则，将符合条件的提取出来。
可以理解为正则表达式就是规则。

 创建正则表达式对象：
 var patt=new RegExp("pattern","modifiers")
 var patt=new RegExp("正则表达式","匹配模式");
 使用字面量：
 var patt=/pattern/modifiers;

修饰符用于执行不区分大小写和全文的搜索。
i - 修饰符是用来执行不区分大小写的匹配。
g - 修饰符是用于执行全文的搜索（而不是在找到第一个就停止查找,而是找到所有的匹配）。

var patt=new RegExp("a") 正则表达式可以检查字符串中是否含有a
patt.test（"bcd"）
var patt= /a[bce]d/
patt.test（"acd"）

规则：这里都是针对执行一次的

[] 里面是或的关系
| 或的关系
[abc] 查找方括号之间的任何字符。
[a-z] 任意的小写字母
[A-Z] 任意的大写字母
[A-z] 任意的字母
[0-9] 查找任何从0至9的数字。
[^] 除了
(x|y) 查找由|分隔的任何选项。
正则表达式的方法：test （）检查字符串是否符合正则表达式，符合：true
patt.test（"字符串"）

量词：设置一个内容的出现次数（只对前面的元素起作用）

{n} 正好出现n次
{m,n} 出现m-n次
{m,} m次以上

```
至少一个 等同于{1，}
```

^ 以……开头
$以……结尾同时使用两者，是很严格的。 n+ 匹配任何包含至少一个 n 的字符串。 n* 匹配任何包含零个或多个 n 的字符串。 n? 匹配任何包含零个或一个 n 的字符串。 n{X} 匹配包含 X 个 n 的序列的字符串。 n{X,Y} 匹配包含 X 至 Y 个 n 的序列的字符串。 n{X,} 匹配包含至少 X 个 n 的序列的字符串。 n$ 匹配任何结尾为 n 的字符串。
^n 匹配任何开头为 n 的字符串。
?=n 匹配任何其后紧接指定字符串 n 的字符串。
?!n 匹配任何其后没有紧接指定字符串 n 的字符串。

正则表达可以作为参数

split() 字符串拆分为数组即使不指定全局，也会全部拆分
search():搜索字符串是否有指定内容，有，返回第一次出现的索引，没有，就返回-1
str="ccf hello hhh polo friy"
res=str.search(/a[re]b/)
console.log(res)
match:提取符合条件的内容
通常match只会找到第一个符合条件的内容，找到后停止，设置全局搜索
str=[1a2b3c4d]
res=str.match(/a/gi)
replace（）：将字符串指定的内容替换为新内容
参数1：被替换的内容可以接受一个正则表达式
参数2: 新结果
默认只会替换第一个

js 2