JavaScript知识点汇总

一、JavaScript的知识总结：
-------------------------------------------------------------------------------------------------------------------------------------
1、BOM(浏览器对象模型)：可以调整浏览器的高度，宽度，和位置等属性的方法就叫做BOM。
-------------------------------------------------------------------------------------------------------------------------------------
2、DOM（文档对象模型）：DOM能够给文档增加交互能力，是一套对文档的内容进行抽象和概念化的方法。DOM是一种API（应用程序接口）。
-------------------------------------------------------------------------------------------------------------------------------------
3、DHTML（动态的html）：他不是一个新技术，而是描述HTML、CSS、JavaScript技术组合的术语；
-------------------------------------------------------------------------------------------------------------------------------------
4、DHTML背后的含义是：
    ·利用HTML把网页标记为各种元素；
    ·利用CSS设置元素样式和他的显示位置；
    ·利用JavaScript实时的操控页面和改变样式；
-------------------------------------------------------------------------------------------------------------------------------------
5、对于JavaScript语言的理解：
·从交互的角度来说，JavaScript能够提升用户体验；
·JavaScript是弱类型语言，只需要var来声明；
·JavaScript的核心就是DOM和BOM，而DOM是控制HTML中的元素，BOM就是控制浏览器的一些东西；
·JavaScript运行在客户的电脑里，不在服务器上；
·JavaScript一般用来编写客户端的脚本；
·JavaScript是一种解释型语言，边执行边解释，从上到下执行；
-------------------------------------------------------------------------------------------------------------------------------------
6、JavaScript的数据类型：
     字符（string）：
     数值（number）：
     布尔（boolean）：true || false；
     数组（Array）：
     undefined：未定义；
     null：空对象；
     Object：对象；
-------------------------------------------------------------------------------------------------------------------------------------
7、逻辑操作符：
   与：（&&）只有两个操作符都是true时，结果才会是true；
   或：（||）有任意一个true时，结果就会是true；
   非：（！）取反；
-------------------------------------------------------------------------------------------------------------------------------------
8、函数：
   函数的定义方法：
    ·第一种创建函数的方法
调用函数，这种方式可以进行变量提升
 fn();
function fn() {
    alert('fn');
 }

·第二种创建函数的方法
 var fn1 = function () {
    alert('fn1');
 }
调用函数，函数变量不能提升
 fn1();
·第三种创建函数的方法
    var fn2=new Function(alert('fn2'));
fn2();
-------------------------------------------------------------------------------------------------------------------------------------
9、变量的作用域：
·全局变量：可以在脚本的任何位置被引用，他的作用域是整个脚本；
·局部变量：用var 声明的变量是局部变量，只存在于声明他的那个函数内部，在那个函数外部是无法引用的；他的作用域仅限于某个特定的函数；
------------------------------------------------------------------------------------------------------------------------------------
10、对象（Object）：
  ·对象是自包含的数据集合，包含在对象里的数据可以通过两种方式访问——属性（property）和方法（method）：
·属性是隶属于某个特定对象的变量；
        ·方法是只有某个特定的对象才能调用的函数；
  ·对象就是由一些属性和方法组合在一起的数据集合；
·在JavaScript中，属性和方法都使用“点”语法来访问；（object.method（））；（object.property）
-------------------------------------------------------------------------------------------------------------------------------------
   内建对象：Array，Date，Math
   宿主对象：form，image，element，document
------------------------------------------------------------------------------------------------------------------------------------
11、DOM操作：
 ·doctype的作用：告知浏览器文档使用哪种 HTML 或 XHTML 规范。该标签可声明三种 DTD 类型，分别表示严格版本、过渡版本以及基于框架的 HTML 文档
·DOM中的节点（元素节点，文本节点，属性节点）：
·元素节点：文档中的一些标签元素；
·文本节点：标签中的内容就代表文本节点；
·属性节点：比如元素的title属性就代表属性节点；

·DOM中获取元素的方法：（元素的ID，标签名，类名）；
------------------------------------------------------------------------------------------------------------------------------------
12、DOM提供的方法：
·getElementById
·getElementByTagName
·getElementByClassName
·getAttribute
·setAttribute
·createElement：创建一个节点；
·appendChild：把节点插入某个文档的节点树，让他成为这个文档某个现有节点的子节点；
·createTextNode：创建一个文本节点；
·insertBefore：在已有元素之前插入一个新元素（父元素.insertBefore（新元素，目标元素））；
·insertAfter：在已有元素之后插入一个新元素；
------------------------------------------------------------------------------------------------------------------------------------
 DOM提供的属性：
·childNodes：获取任何一个元素的所有子元素；
·nodeType：节点类型（分为元素节点1，属性节点2，文本节点3）；
·nodeValue：属性值
·firstChild：
·lastChild：
·innerHTML：用来读写某个特定元素的HTML内容；
------------------------------------------------------------------------------------------------------------------------------------
13、定时器
·setInterval（）：每隔一段时间执行一段代码；
        ·setTimeout（）：该方法能够让某个函数在经过一段预定的时间之后才开始执行；
        ·variable=setTimeout(‘function’，时间)；
·取消这个函数用：clearTimeout（variable）；
------------------------------------------------------------------------------------------------------------------------------------
14、HTML5：
·新特性----
·Canvas：
·视频：
·音频：
·表单：
------------------------------------------------------------------------------------------------------------------------------------
15、JavaScript的核心组成部分：
               ECMAScript：（核心）就是对JavaScript语言的标准规定的各个方面内容的语言的描述；提供核心语言接口；
       DOM：（文档对象模型）就是针对XML但经过扩展用于HTML的应用程序编程接口；提供访问和操作网页内容的方法和接口；
       BOM：（浏览器对象模型）提供与浏览器交互的方法和接口：
------------------------------------------------------------------------------------------------------------------------------------
16、基本数据类型和引用数据类型：
     基本数据类型：undefined、null、number、Boolean、string；

     引用数据类型：Object、Array、

------------------------------------------------------------------------------------------------------------------------------------

     JavaScript中的对象：
------------Date对象：
var date=new Date();
alert(date.getDate().toString());
// alert(date.getDay());
// alert(date.getHours());
// alert(date.getFullYear().toString());
--------------Math对象：
·Math对象的所有属性和对象都是静态的，这就意味着访问Math
·对象时不需要创建Math的实例，
·可以直接通过math对象访问相关的属性和方法。
·var math=Math.abs();
·alert(Math.random());//获取0-1之间的随机数，包括0，但不包括1；
·alert(Math.ceil(34.44));//向上取整
·alert(Math.floor(34.44));//向下取整

----------------------------------------------------------------------------------------------------------------------------------17、document方法：   

·getElementById(id) Node 返回指定结点的引用   
·getElementsByTagName(name) NodeList 返回文档中所有匹配的元素的集合   
·createElement(name) Node Node   
·createTextNode(text) Node 创建一个纯文本结点   
·ownerDocument Document 指向这个节点所属的文档   
·documentElement Node 返回html节点   
·document.body Node 返回body节点   
  ------------------------------------------------------------------------------------------------------------------------------------
18、element方法：   
·getAttribute(attributeName) String 返回指定属性的值   
·setAttribute(attributeName,value) String 给属性赋值   
·removeAttribute(attributeName) String 移除指定属性和它的值   
·getElementsByTagName(name) NodeList 返回结点内所有匹配的元素的集合   
  ------------------------------------------------------------------------------------------------------------------------------------
19、node方法：   
·appendChild(child) Node 给指定结点添加一个新的子结点   
·removeChild(child) Node 移除指定结点的子结点   
·replaceChild(newChild,oldChild) Node 替换指定结点的子结点   
·insertBefore(newChild,refChild) Node 在同一层级的结点前面插入新结点   
·hasChildNodes() Boolean 如果结点有子结点则返回true   
------------------------------------------------------------------------------------------------------------------------------------
20、node属性：   
·nodeName String 以字符串的格式存放结点的名称   
·nodeType String 以整型数据格式存放结点的类型   
·nodeValue String 以可用的格式存放结点的值   
·parentNode Node 指向结点的父结点的引用   
·childNodes NodeList 指向子结点的引用的集合   
·firstChild Node 指向子结点结合中的第一个子结点的引用   
·lastChild Node 指向子结点结合中的最后一个子结点的引用   
·previousSibling Node 指向前一个兄弟节点；如果这个节点就是兄弟节点，那么该值为null   
·nextSibling Node 指向后一个兄弟节点；如果这个节点就是兄弟节点，那么该值为null  
------------------------------------------------------------------------------------------------------------------------------------
21、原型链：
·基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。
·每个构造函数都有一个原型对象，原型对象都包含一个指向构造函数的指针，而实例都包含一个指向原型对象的指针；
------------------------------------------------------------------------------------------------------------------------------------

22、闭包：指有权访问另一个函数作用域中的变量的函数

二 、

计时器ID
window.dearTimeout(计时器ID); //关闭计时器
-----------------------------------------------------------------------------------------------------------------------------------
5.操纵剪贴板：
clipboardData.setData("Text"); //设置剪贴板中的值，参数是类型，返回内容，可以操纵这些内容再赋值回去。
clipboardData.setData("Text",val); //给剪贴板的值赋给val
clipboardData.getData(“Text”); //读取剪贴板的值，返回值为剪贴板中的内容；
clipboardData.clearData(“Text”); //清空剪贴板；
--------------------------------------------------------------------------------------------------------------------------------------
6.获取页面元素：
document.getElementById('某对象'); //获得一个对象，之后可以点出来它的属性
document.write(); //写一些内容到页面上
document.writeln(); //写之后换行
--------------------------------------------------------------------------------------------------------------------------------------
7.最基本字符串操作：
字符串.charAt(i); //取第i个字符
字符串.substr(开始位置，截取数量可省) //取字串
--------------------------------------------------------------------------------------------------------------------------------------
8.关于事件：
这三个事件可以写在body标签里：
onload //页面加载后触发
onunload //页面卸载后触发
onbeforeunload  //页面卸载前触发

--------------------------------------------------------------------------------------------------------------------------------------
还有一些常用事件：
oncopy复制时、onpaste粘贴时、onclick左键单击时、mousedown鼠标点击时。
还有触发事件时的一些信息；
window.event.xxx //存储事件触发时的一些信息，相当于C#的e，里面存储触发时按下了什么键，鼠标坐标等信息
window.event.srcElement.xxx //表示触发事件的源对象，相当于C#的sender
window.event.button //表示触发事件时点的是鼠标的哪个键，onclick永远捕获0，所以要用mousedown事件

三、

1、函数
ECMAscript函数，不能实现传统意义上的函数重载；

2、变量、作用域和内存问题
 基本数据类型和引用类型：
①基本数据类型：Undefined，NUll，Boolean，Number，和String
②引用类型：对象和数组
 复制基本类型的时候和复制引用类型的时候还是有点区别的；
①复制基本类型：
var num1=5；
var num2=num1;
此时num1和num2的值都是5，但是完全独立。
②复制引用类型：
复制引用类型时，同样也会将存储在变量对象中的值复制一份到新分配的空间中，不同的是，这个值的副本实际上是一个指针，而这个指针指向存储在堆中的一个对象。复制操作结束后，两个变量实际上将引用同一个对象。因此，改变其中一个变量，就会影响另一个变量。

作用域分为：全局和局部

3、延长作用域链：
      方法：①执行try-catch语句的catch块；②和with语句；
            JavaScript语句没有块级作用域；

3.1、垃圾收集：JavaScript具有自动垃圾收集机制；

4、引用类型（object和Array类型）


 创建对象的两种方式：
 ①var person=new Object()
 ②var person={
    name：“liming”，//对象字面量的形式；
    age：28
}
Array类型：
 创建数组的方式：

①var arr=new Array();
②var arr=[];

四、

客户端脚本语言

访问网站 在服务器执行C#代码 请求数据库取数据 返回来 到服务器 生成html代码 给浏览器
服务器执行C#代码（这是服务器端代码）
js为什么叫客户端语言  因为不需要提前编译 发的是命令  浏览器执行的
浏览器执行的都是客户端语言


脚本语言:  js  sql  dos命令  这些直接就能解释执行 ,不需要提前编译


html没有计算能力   
C#有计算能力啊,为什么不用呢,
举例:
鼠标光标离开 然后给服务器发送是否合法--(通过网络)-麻烦


都写完再验证也不好,---体验不好,在浏览器直接执行 并且还有计算能力


js也借鉴了一些java, vb也是脚本语言,因为太强大,所以不用了


另外,vb是微软出的语言,其他人不希望自己的浏览器支持微软的.


工具:vs2010 ;vs2008没有智能提示


静态语言:编译的时候已经确定了数据类型


动态语言: 程序运行的时候才能确定数据类型


所以,在vs中的智能提示就不靠谱了,要相信自己
不是vs做的不好,因为js是动态语言,不知道什么时候是什么类型.
js弱类型语言


ECMAScript是一种由欧洲计算机制造商协会（ECMA）通过ECMA-262标准化的脚本程序设计语言 


基本语法,只是有了一些基本的东西 
Dom就可以做很多功能了


就好比 基本语法,和类库
Dom也有规范,各浏览器 差异比较大,css也很大


Bom没有规范,各自浏览器自己扩展的.


js注意几点
1大小写敏感 
2如类型语言
3声明变量用var
4字符串用单引号
5每句话后面单引号


js这门语言干嘛的?


增强用户体验,内容更丰富,不需要向服务器发送代码。






如何导入外部代码


这句话可以连入外部的js文件,很强大,但是严格
如果连接外部文件的话 这句话就写到body中
因为这个文件可以写几个l多个连接,肯定先下载完第一个才能下载第二个才能执行,


<script type="text/javascript" src="1.js">(这里不要写代码)</script>
如果不这么做的话.体验不好


onblur 鼠标失去焦点事件
onclick 单击事件
ondbclick双击事件
onfocus 得到焦点事件
onkeydown 键按下事件
onkeypress 键按下 参数不一样
onkeyup 键按下抬起事件
onmousedown鼠标按下事件
onmousemove鼠标悬浮事件
onmouseover进来
onmouseout 出去
onmouseup 鼠标按下抬起


超链接不想跳到任何地方href="#" 就可以了 但是如果在网页下面就有问题了
会自动的跳到上面去,怎么办呢
href后写的http://这是协议
可以写href="javascript:alert('new Date().tolocaleTimeString();')"
Var x; alert(x);也是undefined
 function f1() {
            var x = 10;
            x++;
        };
        var val = f1();
        alert(val);
--------上面的也是undefined 方法没有返回值---变量没定义直接显示会报错,想检测用alert(typeof(x));
 if (typeof x == 'undefined') {
            alert('x不可用');
        } else {
        alert('可用');
        }
---------------------typeof可以检测
null是已知的值,空对象;存在;undefiend未定义
var obj=new object();
alert(obj.toString());有值
obj=null; 这样就清空了当obj指向null，指的是,原来的对象被回收了
alert(obj.toString());有值,报错,空对象


无论变量是undefined还是null都是不可用的.


var a;
var b=null;
if(a==b){alert('一样');}else{'不一样'}
如果用===就不一样了,三个=表示严格等于
===先判断类型相同,再判断数据是否相同


var x;
alert(Boolean(x));为false
一般:undefined null  0 空字符串 都是false