javascript基础部分

1  数据类型:

基础数据类型（通过typeof来检测）:Number,string,undefined,null,boolean,function

typeof只能检测：number,string,boolean,undefined,function,object,无法识别：null,regExparagument等细分对象类型；

对象数据类型（以基础数据类型为基本，通过instanceof来检测）：isstring,isfunction,isarray,isNode etc.

2 条件、循环语句

if:

function age(){
        var num=document.getElementById('age').value;
        if(num<=18){
            alert("你还未成年")
        }
        else if(num<=30){
            alert("你是青年");
        }
        else{
            alert("你老啦");
        }
    }

switch:

switch(num){
              case 90:
                  msg="A"
                  break;
              case 80:
                  msg="B"
                  break;
              case 70:
                  msg="C"
                  break;
              case 60:
                  msg="D"
                  break;
          }
for:

for(var i=0;i<=10;i=i+1){
               s+=i;
           }

3 DOM基础

一、DOM基础: 文档对象模型(Doucment Object Model,DOM)是表示文档(如HTML文档、XML文档)和访问、操作构成文档的各种元素的应用程序接口。HTML文档的层次结构被表示成树形结构

Node接口为遍历和操作树定义了属性和方法。Node对象的childNodes属性将返回子节点的列表NodeList对象，firstChild、lastChild、nextSibling、previousSibling和parentNode属性提供了遍历树的方法。appendChild()、removeChild()、replaceChild(old,new)和insertBefore()方法，可以给文档树添加节点或从文档中删除节点。

1.节点(node)层次 Document－－最顶层的节点，所有的其他节点都是附属于它的。 DocumentType－－DTD引用（使用<!DOCTYPE>语法）的对象表现形式，它不能包含子节点。 DocumentFragment－－可以像Document一样来保存其他节点。 Element－－表示起始标签和结束标签之间的内容，例如<tag></tab>或者<tag/>。这是唯一可以同时包含特性和子节点的节点类型。 Attr－－代表一对特性名和特性值。这个节点类型不能包含子节点。 Text－－代表XML文档中的在起始标签和结束标签之间，或者CDataSection内包含的普通文本。这个节点类型不能包含子节点。 CDataSection－－<![CDATA[]]>的对象表现形式。这个节点类型仅能包含文本节点Text作为子节点。 Entity－－表示在DTD中的一个实体定义，例如<!ENTITY foo"foo">。这个节点类型不能包含子节点。 EntityReference－－代表一个实体引用，例如&quot;。这个节点类型不能包含子节点。 ProcessingInstruction－－代表一个PI。这个节点类型不能包含子节点。 Comment－－代表XML注释。这个节点不能包含子节点。 Notation－－代表在DTD中定义的记号。这个很少用到。
Node接口定义了所有节点类型都包含的特性和方法。

特性/方法 类型/返回类型 说明
nodeName String 节点的名字;根据节点的类型而定义
nodeValue String 节点的值;根据节点的类型而定义
nodeType Number 节点的类型常量值之一
ownerDocument Document 指向这个节点所属的文档
firstChild Node 指向在childNodes列表中的第一个节点
lastChild Node 指向在childNodes列表中的最后一个节点
childNodes NodeList 所有子节点的列表
previousSibling Node 指向前一个兄弟节点;如果这个节点就是第一个兄弟节点，那么该值为null
nextSibling Node 指向后一个兄弟节点;如果这个节点就是最后一个兄弟节点，那么该值为null
hasChildNodes() Boolean 当childNodes包含一个或多个节点时,返回真
attributes NamedNodeMap 包含了代表一个元素的特性的Attr对象;仅用于Element节点
appendChild(node) Node 将node添加到childNodes的末尾
removeChild(node) Node 从childNodes中删除node
replaceChild(newnode,oldnode) Node 将childNodes中的oldnode替换成newnode
insertBefore(newnode,refnode) Node 在childNodes中的refnode之前插入newnodd

除节点外，DOM还定义了一些助手对象，它们可以和节点一起使用，但不是DOM文档必有的部分。 NodeList－－节点数组，按照数值进行索引;用来表示和一个元素的子节点。 NamedNodeMap－－同时使用数值和名字进行索引的节点表;用于表示元素特性。
2.访问相关的节点 下面的几节中考虑下面的HTML页面

<html>

    <head>

        <title>DOM Example</title>

    </head>

    <body>

        <p>Hello World!</p>

        <p>Isn't this exciting?</p>

        <p>You're learning to use the DOM!</p>

    </body>

</html>

3.处理特性 正如前面所提到的，即便Node接口已具有attributes方法，且已被所有类型的节点继承，然而，只有 Element节点才能有特性。Element节点的attributes属性其实是NameNodeMap,它提供一些用于访问和处理其内容的方法： getNamedItem(name)－－返回nodename属性值等于name的节点; removeNamedItem(name)－－删除nodename属性值等于name的节点; setNamedItem(node)－－将node添加到列表中，按其nodeName属性进行索引; item(pos)－－像NodeList一样，返回在位置pos的节点; 注：请记住这些方法都是返回一个Attr节点，而非特性值。
NamedNodeMap对象也有一个length属性来指示它所包含的节点的数量。 当NamedNodeMap用于表示特性时，其中每个节点都是Attr节点，这的nodeName属性被设置为特性名称，而nodeValue属性被设置为特性的值。例如，假设有这样一个元素： <p style="color:red" id="p1">Hello world!</p> 同时，假设变量oP包含指向这个元素的一个引用。于是可以这样访问id特性的值: var sId = oP.attributes.getNamedItem("id").nodeValue; 当然，还可以用数值方式访问id特性，但这样稍微有些不直观： var sId = oP.attributes.item(1).nodeValue; 还可以通过给nodeValue属性赋新值来改变id特性： oP.attributes.getNamedItem("id").nodeValue="newId"; Attr节点也有一个完全等同于(同时也完全同步于)nodeValue属性的value属性，并且有name属性和nodeName属性保持同步。我们可以随意使用这些属性来修改或变更特性。 因为这个方法有些累赘，DOM又定义了三个元素方法来帮助访问特性： getAttribute(name)－－等于attributes.getNamedItem(name).value; setAttribute(name,newvalue)－－等于attribute.getNamedItem(name).value=newvalue; removeAttribute(name)－－等于attribute.removeNamedItem(name)。
4.访问指定节点

(1)getElementsByTagName() 核心(XML) DOM定义了getElementsByTagName()方法，用来返回一个包含所有的tagName(标签名)特性等于某个指定值的元素的NodeList。在Element对象中，tagName特性总是等于小于号之后紧跟随的名称－－例如，<img />的tagName是"img"。下一行代码返回文档中所有<img />元素的列表： var oImgs = document.getElementsByTagName("img"); 把所有图形都存于oImgs后，只需使用方括号或者Item()方法（getElementsByTagName()返回一个和childNodes一样的NodeList），就可以像访问子节点那样逐个访问这些节点了： alert(oImgs[0].tagName);      //outputs "IMG" 假如只想获取在某个页面第一个段落的所有图像，可以通过对第一个段落元素调用getElementsByTagName()来完成，像这样： var oPs = document.getElementByTagName("p"); var oImgsInp = oPs[0].getElementByTagName("img"); 可以使用一个星号的方法来获取document中的所有元素： var oAllElements = document.getElementsByTagName("*"); 当参数是一个星号的时候，IE6.0并不返回所有的元素。必须使用document.all来替代它。

(2)getElementsByName() HTML DOM 定义了getElementsByName()，这用来获取所有name特性等于指定值的元素的。

(3)getElementById() 这是HTML DOM定义的第二种方法，它将返回id特性等于指定值的元素。在HTML中，id特性是唯一的－－这意味着没有两个元素可以共享同一个id。毫无疑问这是从文档树中获取单个指定元素最快的方法。 注：如果给定的ID匹配某个元素的name特性，IE6.0还会返回这个元素。这是一个bug，也是必须非常小心的一个问题。
5.创建新节点 最常用到的几个方法是 createDocumentFragment()－－创建文档碎片节点 createElement(tagname)－－创建标签名为tagname的元素 createTextNode(text)－－创建包含文本text的文本节点
createElement()、createTextNode()、appendChild()

<html>

    <head>

        <title>createElement() Example</title>

        <script type="text/javascript">

            function createMessage() {

                var oP = document.createElement("p");

                var oText = document.createTextNode("Hello World!");

                oP.appendChild(oText);

                document.body.appendChild(oP);

            }

        </script>

    </head>

    <body onload="createMessage()">

    </body>

</html>

removeChild()、replaceChild()、insertBefore() 删除节点

<html>

    <head>

        <title>removeChild() Example</title>

        <script type="text/javascript">

            function removeMessage() {

                var oP = document.body.getElementsByTagName("p")[0];

                oP.parentNode.removeChild(oP);

            }

        </script>

    </head>

    <body onload="removeMessage()">

        <p>Hello World!</p>

    </body>

</html>

替换

<html>

    <head>

        <title>replaceChild() Example</title>

        <script type="text/javascript">

            function replaceMessage() {

                var oNewP = document.createElement("p");

                var oText = document.createTextNode("Hello Universe!");

                oNewP.appendChild(oText);

                var oOldP = document.body.getElementsByTagName("p")[0];

                oOldP.parentNode.replaceChild(oNewP, oOldP);

            }

        </script>

    </head>

    <body onload="replaceMessage()">

        <p>Hello World!</p>

    </body>

</html>

新消息添加到旧消息之前

<html>

    <head>

        <title>insertBefore() Example</title>

        <script type="text/javascript">

            function insertMessage() {

                var oNewP = document.createElement("p");

                var oText = document.createTextNode("Hello Universe!");

                oNewP.appendChild(oText);

                var oOldP = document.getElementsByTagName("p")[0];

                document.body.insertBefore(oNewP, oOldP);

            }

        </script>

    </head>

    <body onload="insertMessage()">

        <p>Hello World!</p>

    </body>

</html>

createDocumentFragment() 一旦把节点添加到document.body（或者它的后代节点）中，页面就会更新并反映出这个变化。对于少量的更新，这是很好的，然而，当要向document添加大量数据时，如果逐个添加这些变动，这个过程有可能会十分缓慢。为解决这个问题，可以创建一个文档碎片，把所有的新节点附加其上，然后把文档碎片的内容一次性添加到document中，假如想创建十个新段落。

<html>

    <head>

        <title>insertBefore() Example</title>

        <script type="text/javascript">

            function addMessages() {

                var arrText = ["first", "second", "third", "fourth", "fifth", "sixth", "seventh", "eighth", "ninth", "tenth"];

                var oFragment = document.createDocumentFragment();

                for (var i=0; i < arrText.length; i++) {

                    var oP = document.createElement("p");

                    var oText = document.createTextNode(arrText[i]);

                    oP.appendChild(oText);

                    oFragment.appendChild(oP);

                }

                document.body.appendChild(oFragment);

            }

        </script>

    </head>

    <body onload="addMessages()">

    </body>

</html>

6.让特性像属性一样 大部分情况下，HTML DOM元素中包含的所有特性都是可作为属性。 假设有如下图像元素： <img src = "mypicture.jpg" border=0 /> 如果要使用核心的DOM来获取和设置src和border特性，那么要用getAttribute()和setAttribute()方法： alert(oImg.getAttribute("src")); alert(oImg.getAttribute("border")); oImg.setAttribute("src","mypicture2.jpg"); oImg.setAttribute("border",1); 然而，使用HTML DOM，可以使用同样名称的属性来获取和设置这些值： alert(oImg.src); alert(oImg.border); oImg.src="mypicture2.jpg"; oImg.border ="1"; 唯一的特性名和属性名不一样的特例是class属性，它是用来指定应用于某个元素的一个CSS类，因为class在ECMAScript中是一个保留字，在javascript中，它不能被作为变量名、属性名或都函数名。于是，相应的属性名就变成了className; 注：IE在setAttribute()上有很大的问题，最好尽可能使用属性。

7.table方法 为了协助建立表格，HTML DOM给<table/>,<tbody/>和<tr/>等元素添加了一些特性和方法。 给<table/>元素添加了以下内容：

特性/方法 说明
caption 指向<caption/>元素并将其放入表格
tBodies <tbody/>元素的集合
tFoot 指向<tfoot/>元素（如果存在）
tHead 指向<thead/>元素（如果存在）
rows 表格中所有行的集合
createTHead() 创建<thead/>元素并将其放入表格
createTFood() 创建<tfoot/>元素并将其放入表格
createCpation() 创建<caption/>元素并将其放入表格
deleteTHead() 删除<thead/>元素
deleteTFood() 删除<tfoot/>元素
deleteCaption() 删除<caption/>元素
deleteRow(position) 删除指定位置上的行
insertRow(position) 在rows集合中的指定位置上插入一个新行

<tbody/>元素添加了以下内容

特性/方法 说明
rows <tbody/>中所有行的集合
deleteRow(position) 删除指定位置上的行
insertRow(position) 在rows集合中的指定位置上插入一个新行

<tr/>元素添加了以下内容

特性/方法 说明
cells <tr/>元素中所有的单元格的集合
deleteCell(postion) 删除给定位置上的单元格
insertCell(postion) 在cells集合的给点位置上插入一个新的单元格

8.遍历DOM NodeIterator，TreeWalker DOM Level2的功能，这些功能只有在Mozilla和Konqueror/Safari中才有

4  数组和对象

Javascript是由浏览器解释运行的，所以其和操作系统也是无关的，也是平台无关性的。

一、javascript对象

javascript的object类型

1.使用new运算符
  var ob=new Object();创建一个对象
测试对象是什么类型：用typeof ，使用例子：typeof ob;
对象中包含哪些元素：
   1.属性
   2.函数
属性的创建方法：ob.name="例子"，alert(ob.name);
2.可以省略new关键字
  var ob=Object();
3.字面量方式创建对象
  var ob={};
  创建属性：var ob={name:'例子'，age:18};
  创建属性也可以是：var ob={‘name':'例子'};双引号也可以
  输出：alert(ob.name);
        alert(ob.['name']);用数组的方式输出，双引号也可以
        
4.给对象创建方法
1.传统的创建方法
function objrun(){
return '123';
}
var ob=new Object();
ob.name='lizi';
ob.age=18;
ob.run=objrun();会返回值，ob.run=getrun这个会打印出代码
alert(ob.run);
2.字面量的创建方法
var obj={
     name:'我的名字',
     age:21,
     run:function(){//匿名方法
       return '123';
      }
};
测试调用函数
alert(obj.run());
5.删除属性
  delete obj.name;
小技巧：字面量的对象显得代码更加简洁，具有封装的感觉
   例如：我们要穿多个参数，字面量方法更加简洁
  function box(obj){
      if(obj.name!=undefined)alert(obj.name);
      if(obj.love!=undefined) alert(obj.age);
}
  a. var obj={
     name：‘我的名字’,
     age:21
     }
b.匿名对象传参数
   box({
     name：‘我的名字’,
     age:21
     });
二、Array类型
   创建Array的方法有两种：
 1.使用new关键字
  var obj=new Array();
var obj=new Array(10);创建一个包含10元素的数组
var obj=new Array('我的名字','地址');创建了一个数组，并分配了2个元素
   alert(typeof obj);obj属于Object类型
 
var obj=new Array('我的名字','地址')，数组值的打印：
  1.以下标
  2.直接alert(obj);
2.字面量的数组创建
ps:和object一样，字面量的写法不会调用Array()构造方法，（Firefox除外）

字面量的增加修改
toLocaleString()方法有本地格式化的功能，其得到的日期是本电脑的时间
join()方法是将数组以某种方式（在这里是用%分隔）分隔返回的字符串

数组的栈方法（后进先出），就是类似于有底的杯子中装了东西，再取出的过程
 alert(obe.push("我家门前")); 在数组的最后位置添加一个元素，并返回长度
 
alert(obe.shift());   移除数组中的第一个元素  ,并返回被移除的那个元素
alert(obe.unshift("我家111"));   在数组的第一个位置添加一个元素 ,并返回长度
alert(obe.pop());   移除数组中的最后一个元素  ,并返回被移除的那个元素

alert(box.reverse());返回一个倒序的数组

var box=[1,5,7,9,3,2];

       box.sort();从小到大排序
 
数组中操作方法:
1.concat()方法，是在原来的数组中添加一个新的元素并创建一个新的数组

  var box=['你好',123];
        var info=box.concat("世界");
                  alert(info); 是在原来的数组中添加一个新的元素并创建一个新的数组
        alert(box); 原来的数组没有变化
 
2.slice()方法的用法，取值
    var box=['你好',123,'世界'];
        var info=box.slice(1);  从下标为1开始读取数据直到把该数组的值读完
                 alert(info);
 
var box=['你好',123,'世界'];
 //注意不是从第1个位置取3个，而是从第一个位置取到第3个位置（也就是不管从什么位置开始，都只取到第三个元素的地方）
        var info=box.slice(1,3); 
        alert(info);
3.splice()方法的用法
     a.筛选功能
     var box=['你好',123,'世界'];
        alert(box.splice(0,3));    //返回从第0个位置取3个元素
     b.删除功能
     var box=['你好',123,'世界'];
     box.splice(0,2);//删除了从第0个位置取3个的元素
        alert(box); //原对象只剩下’世界‘了

c.插入功能

     var box=['你好',123,'世界'];
//1,0的意思是从下标为1的位置开始不取值，  1,0,"真","好"代表的是从下标为1的位置开始插入数据
       //box.splice(1,0,"真","好");
//1,2的意思是从下标为1的位置开始截掉2个值，  1,2,"真","好"代表的是从下标为1的位置开始插入数据
         box.splice(1,2,"真","好");
        alert(box);
     d.替换功能
      var box=['你好',123,'世界'];
//1,1的意思是从下标为1的位置开始截掉1个值，并以100来替换 ，其实和插入功能差不多
box.splice(1,1,100);//返回被删除的那一条
alert(box);
 
4 Window对象
Window属性：closed,frames[],history,location

Window对象的重要方法 alert() confirm() prompt()  　　　　

向用户显示简单的对话框，confirm()和prompt()用于获取用户的响应 　　close()  　　　　关闭窗口 　

　focus() blur()  　　　　请求或放弃窗口的键盘焦点。focus()方法还通过把窗口提前到堆栈顺序的最前面，  从而确保窗口可见

　　moveBy() moveTo()  　　　　移动窗口 　

　open()  　　　　打开新的定义窗口，用指定的特性显示指定的URL 　　print()  　　　　打印窗口或框架中的内容，就像用户点击了窗口工具栏中的Print按钮一样(某些老版  本浏览器不支持此方法)　　 　　resizeBy() resizeTo()  　　　　调整窗口大小 　　scrollBy() scrollTo()  　　　　滚动窗口中显示的文档 　　setInterval() clearInterval()  　　　　设置或者取消重复调用的函数，该函数在两次调用之间有指定的延迟 　　setTimeout() clearTimeout()  　　　　设置或取消在指定的若干毫秒后要调用一次的函数

　　Window对象的onerror属性比较特殊，如果给这个属性赋一个函数，那么只要这个窗口中发生JavaScript错误，该函数就会被调用，它就成了窗口的错误处理函数。定义onerror属性方法，如：         　　window.onerror=method； //注意method为要处理错误调用的函数，不要()；

Window.navigator属性引用的是包含Web浏览器总体信息的Navigator对象

 

5 String

1.获取字符串的长度：

var s = Hello world; document.write(length:+s.length);   2.为字符串添加各种样式，如：  var txt ="Hello world";   document.write('length:' + txt.fontsize(15)); txt.big() txt.small() txt.bold() fixed() txt.strike() txt.link('http://www.w3school.com.cn')

3.获取字符串中部分内容首次出现的位置 var hw_text = 'Hello world'; document.write(hw_text.indexOf('Hello')

4.内容替换：  var str='Visit Microsoft!';             document.write(str.replace('Microsoft', 'W3School'));

5 要在字符串中添加换行符，需要使用转义字符"\n"： var confirmString = "You did not enter a response to the last " +         "question.\n\nSubmit form anyway?"; var confirmValue = confirm(confirmString);   但这种方法只能用在像警告、确认对话框之类的情况下，如果将这段文本作为HTML内容呈现，就无效了，此时用"<br>"代替它：             var confirmString = "You did not enter <br /> a response to the last ";             document.write(confirmString);

6 将两个或多个字符串拼接为一个大的字符串,String对象还提供了方法concat()，它完成与"+"相同的功能： var longString = "One piece " + "plus one more piece.";

7 访问字符串的子串 使用substring()或slice()方法, 还有一个方法是substr()，其原型为： string.substr(start, length) substring()的原型为：  string.substring(from, to) substring()总是从两个参数中较小的那个开始，到较大的那个结束

slice()的原型为：  string.slice(start, end)     参数start表示子串的起始位置，如果为负数，那么可以理解为倒数第几个开始，例如-3表示从倒数第三个开始；参数end表示结束位置，与start一 样，它也可以为负数，其含义也表示到倒数第几个结束。slice()的参数可以为负数，所以要比substring()更加灵活，但没那么宽容了，如果 start比end要大，它将返回一个空字符串(示例略)。

8 字符串的大小写转换 使用toLowerCase()和toUpperCase()方法.

9 判断两个字符串是否相等 先将用户的输入值全部转换为大写（或小写），然后再行比较：== ===   != !== var name = document.form1.txtUserName.value.toLowerCase();     if(name == "urname")

var strA = "i love you!"; var strB = new String("i love you!");

这两个变量含有相同的字符序列，但数据类型却不同，前者为string，后者为object，在使用"=="操作符时，JavaScript会尝试各种求值，以检测两者是否会在某种情况下相等。所以下面的表达式结果为true： strA == strB。     第二种操作符是"严格"的"==="，它在求值时不会这么宽容，不会进行类型转换。所以表达式strA === strB的值为false，虽然两个变量持有的值相同。     有时代码的逻辑要求你判断两个值是否不相等，这里也有两个选择："!="和严格的"!=="，它们的关系就类似于"=="和"==="。

if(document.form1.txtAge.value == someNumericVar)  也可以提前转换：     if(parseInt(document.form1.txtAge.value) == someNumericVar)

10 字符串的查找  String对象有一个与indexOf()对应的方法，lastIndexOf()：

使用string的indexOf()方法：     strObj.indexOf(subString[, startIndex])

11 在Unicode值和字符串中的字符间转换 strObj.charCodeAt(index)   String.fromCharCode(c1, c2, ...)     var strObj = "ABCDEFG";     var code = strObj.charCodeAt(2); // Unicode value of character 'C' is 67 如果index指定的索引处没有字符，则返回值为NaN。

要将Unicode编码转换为一个字符，使用String.fromCharCode()方法，注意它是String对象的一个"静态方法"，也就是说在使用前不需要创建字符串实例：

var str = String.fromCharCode(72, 101, 108, 108, 111);  // str == "Hello"

12 JavaScript中定义的转义字符加单引号或双引号来表示，如“/'”或“/"”。JavaScript的转义序列有：
 　　　　/0  　　       NUL字符(/u0000)
 　　　　/b  　　        退格符(/u0008)
　　　　 /t  　　        水平制表符(/u0009)
　　　　 /n 　　         换行符(/u000A)
　　　　 /v  　　        垂直制表符(/u000B)
　　　　 /f  　　          换页符(/u000C)
 　　　　/r 　　          回车符(/u000D)
　　　　 /"  　　         双引号(/u0022)
　　　　 /'  　　         单引号或撇号(/u0027)
 　　　　//  　　         反斜杠(/u005C)
 　　　　/xXX  　　　由两位十六进制数值XX指定的Latin-1字符
 　　　　/uXXXX  　　由四位十六进制数XXXX指定的Unicode字符
 　　　　/XXX  　　　由一位到三位八进制数(1到377)指定的Latin-1字符。ECMAScript不支持。

6 Math方法

1.Math.random() -- 返回0和1之间的伪随机数 可能为0，但总是小于1，[0,1)。  Math.random()*10//返回 0-10 之间的随机数。 随机整数  Math.random()*(20-10)+10 //返回10-20之间的随机数。

2 Math.floor() -- 向下取得一个最接近的整数 只取出其中的整数   Math.floor(12.2)// 返回12 Math.floor(12.0)//返回12

3 Math.ceil() -- 向上取得一个最接近的整数 Math.ceil(12.2)//返回13 Math.ceil(12.0)// 返回12

4 Math.round() -- 进行四舍五入 Math.round(12.2)// 返回12                             Math.round(12.7)//返回13                             Math.round(12.0)//返回12

7 Date类

Date方法 //UTC()世界协调时间，它会按照它的基准去计算，所以中国大陆是属于东八区，所以时间要被加8个小时 alert(Date.UTC(2014,3,4,22,22,22,45));//返回的毫秒数 //如果没有UTC()就返回本地时间

1 通用方法，new Date()得到当前时间，但各个浏览器显示的方法不同，所以不提倡使用

Date(2014,3,4,22,22,22,45);   var date=new Date(2014,3,4,22,22,22,45);

alert(date); //返回Fri Apr 04 2014 22:22:22 GMT+0800         alert("toString: "+date.toString());  //返回Fri Apr 04 2014 22:22:22 GMT+0800         alert("toLocaleString: "+date.toLocaleString()); //返回2014年4月4日 22:22:22         alert("valueOf"+date.valueOf());//返回1396621342045

2 Date类型的日期格式化方法

var date=new Date(2014,3,4,22,22,22,45); alert(date.toDateString()); //Fri Apr 04 2014 alert(date.toTimeString());

//22:22:22 GMT+0800 alert(date.toLocaleDateString());//2014年4月4日 alert(date.toLocaleTimeString());  //22:22:22  alert(date.toUTCString());  //Fri, 04 Apr 2014 14:22:22 GMT

3 组件方法 date.get....或者date.set....各种方法的使用da.getYear(),da.getMonth()  da.setHours(9);

alert(da.getUTCHours()); //返回上午1点（减去了8个小时）     alert(da.getTimezoneOffset());   //计算本时区和UTC时区之间的差距，谷歌不支持

8 数据类型转换

1从数字到字符串的转换在JavaScript中是最常执行的。

我们可以通过以下方法显式的实现：  　　

　　var str = String(number);  　　　

　var str = number + "";  　　　

　var string = number.toString(); 　　//number被转换成Number对象，再调用Number.toString()方法

2这三种方法都回对结果字符串的数字进行适当舍入toFixed。 　　　

　 var n = 123456.789;  　　　　n.toFixed(0);  　　　　//"123457"  　　　　n.toFixed(2); 　　　　 //"123456.79"  　　　　n.toExponential(1);　 //"1.2e+5" 　　　　 n.toExponential(3);　 //"1.235e+5"  　　　　n.toPrecision(4); 　　//"1.235e+5"  　　　　n.toPrecision(7); 　　//"123456.8"

3 如果parseInt()和parseFloat()不能将指定的字符串转换成数字，将返回NaN：

parseInt("3 abc");                  //3  　　　　parseFloat("3.15 abc");       //3.15  　　　　parseInt("12.34");                 //12  　　　　parseInt("0xFF");                  //255

parseInt("eleven"); 　　　 //NaN  　　　　parseFloat("s12.35"); 　　//NaN

9 定时器

1使用定时器实现JavaScript的延期执行或重复执行 window对象提供了两个方法来实现定时器的效果，分别是window.setTimeout()和window.setInterval。其中前者可以使一段代码在指定时间后运行；而后者则可以使一段代码每过指定时间就运行一次。它们的原型如下： window.setTimeout(expression,milliseconds); window.setInterval(expression,milliseconds); 其中，expression可以是用引号括起来的一段代码，也可以是一个函数名，到了指定的时间，系统便会自动调用该函数，当使用函数名作为调用句柄时， 不能带有任何参数；而使用字符串时，则可以在其中写入要传递的参数。两个方法的第二个参数是milliseconds，表示延时或者重复执行的毫秒数。

2 window.setTimeout方法

这段代码将使得页面打开5秒钟后显示对话框“hello”。其中最后一句也可以写为： window.setTimeout("hello()",5000);

function hello(){ alert("hello"); } window.setTimeout(hello,5000);

如果要取消显示，只需单击页面任何一部分，就执行了window.clearTimeout方法，使得超时操作被取消。 function hello(){       alert("hello"); } var id=window.setTimeout(hello,5000); document.onclick=function(){      window.clearTimeout(id); z }

3 window.setInterval方法

该方法使得一个函数每隔固定时间被调用一次，是一个很常用的方法。如果想要取消定时执行，和clearTimeout方法类似，可以调用 window.clearInterval方法。clearInterval方法同样接收一个setInterval方法返回的值作为参数。例如：

复制代码 代码如下:

//定义一个反复执行的调用 var id=window.setInterval("somefunction",10000); //取消定时执行 window.clearInterval(id);

10 浏览器对象

Window对象是客户端JavaScript的全局对象，它定义了大量的属性和方法，提供给客户对Web浏览器的窗口进行操作。它还定义了引用其他重要对象的属性(如引用Document对象的document属性)。此外Window对象还包括两个自我引用的属性：window和self，可以使用它们来直接引用Windwo对象。

Window对象的document属性引用与这个窗口关联在一起的Document对象；location属性引用与该窗口关联在一起的Location对象。Window对象还包括一个frames[]数组，引用代表原是窗口的框架的Window对象。因此，document代表的是当前窗口的Document对象，而frames[1].document引用的是当前窗口的第二个子框架的Document对象。

对于多窗口或多框架，除了考虑Window对象中定义的变量和函数的持续性外，还需要考虑Window对象自身的持续性。只要浏览器的顶级窗口存在，那代表它的Window对象会一直存在，对它的Window对象的引用都有效。
　　这意味着，Window对象的生存期可能比它包含和显示的网页长，也可能比它显示的网页所包含的脚本长。

如果JavaScript作为一个文件中使用的唯一脚本，在<head>部分加入如下代码：
 <meta http equiv="Centent-Script-type" content="text/javascript">
　　这样，就无需指定<script>的language和type属性了。

如果<script>标签包含了src属性，浏览器会忽略<script>和</script>标记之间的代码。
　　使用src性质可以将JavaScript代码与HTML代码分离，从而简化HTML文件；如果JavaScript函数被多个页面共享，可以将它们放置在单独JavaScript文件中，使浏览器将其缓存起来，这样可以提高装载速度；由于src的值可以是任意URL，因此来自一个Web服务器的JavaScript程序或网页可以使用由另一个Web服务器输出的代码(如子程序库)。

任何使用正规的URL的地方都可以使用javascript:URL。

11 创建对象后，我们可以通过"."运算符，在对象中创建新属性、引用已有属性、设置属性值等。

var book = new Object();
            book.title = "Book Title";//创建新属性 设置属性值

book.name = new Object();//
            book.chaptor1 = new Object();//创建新属性
           
            book.chaptor1.title = "dd";// 设置属性值
            book.name.year = "20"; 
            alert(book.name.year);

12 JavaScript 函数

1   由于JavaScript是一种无类型语言，所以不能给函数的参数指定类型，JavaScript也不会检测传递的参数的数据类型。而且JavaScript也不会检测传递的参数的个数是否正确，如果参数比函数需要的个数多，多余的值会被忽略；如果传递的参数比函数需要的个数少，缺少处补undefined。

　　同样，由于JavaScript是一种无类型语言，所以无需定义函数的返回值类型，如果在函数体中不包含return语句，将返回undefined。

2    同样，由于JavaScript是一种无类型语言，所以无需定义函数的返回值类型，如果在函数体中不包含return语句，将返回undefined。

13 正则表达式定义

1 RegExp对象 　　构造函数RegExp()有两个字符串参数，其中第二个参数是可选的，它们是"g"、"i"、"m"的组合。第一个参数是包含正则表达式主体的字符串，也就是正则表达式直接量中出现斜线之间的文本。

　　RegExp对象定义了两个用于执行模式匹配操作的方法。 　　exec()方法与String的match()方法相似，它是以字符串为参数的RegExp方法。exec()方法对一个指定的字符串执行一个正则表达式，也就是在一个字符串中检索匹配。如果没有匹配返回null，如果找到匹配返回一个数组。结果与match()方法的非全局检索返回的数组一样，而不管正则表达式中是否具有全局属性g。

var patt1 = new RegExp("e");
            var patt1 = /e/;
            document.write(patt1.test("The best things in life are free"));  //test();exec();compile()

2 正则表达式： 　

1　直接量，var pattern = /s$/;  //与所有以字母"s"结尾的字符串匹配 　　

2   构造函数，var pattern = new RegExp('s$');

var patt1=new RegExp("e");当您使用该 RegExp 对象在一个字符串中检索时，将寻找的是字符 "e"。

RegExp 对象的方法 RegExp 对象有

3 个方法：test()、exec() 以及 compile()。

test() test() 方法检索字符串中的指定值。返回值是 true 或 false。

例子： var patt1=new RegExp("e");

document.write(patt1.test("The best things in life are free")); 由于该字符串中存在字母 "e"，以上代码的输出将是：

14  JavaScript　变量

1 JavaScript的变量是无类型(untype)的 2 JavaScript的变量可以存放任何类型的值 3 JavaScript可以在必要的时候自动将一种类型的值转换成另外一种类型。

4 在JavaScript中声明一个变量的方法有： 　　　 var i;  　　　var sum;  　　　var i,sum;  　　　var i =0;  　　　var sum = 20;  　　　var str = "hello";

　　如果一个变量被声明了，但是没有赋值，它的初始值就是undefined

5 在JavaScript中可以使用var语句多次声明同一个变量，而不造成错误。 如果尝试给一个未用var声明的变量赋值，JavaScript会隐式地声明这个变量，不过这个变量将被创建为全局变量，即使是在一个函数体内。 如果尝试读一个未声明的变量的值，JavaScript会生成一个错误。如果读一个声明后，未赋值的变量的值，将返回undefined

6 对于无用的存储单元，JavaScript提供了一种无用存储单元收集的方法，自动释放无用的内存空间。

7 不管是全局变量还是局部变量，JavaScrit都提供了一个独立的对象来存储它们。

15 JavaScript语句

1 复合语句：如语句块。

　　if语句：

　　else if语句：

　　switch语言：JavaScript的switch语言与Java和C非常相似，但要注意，在JavaScript中switch语言匹配case表达式是用===等同运算符判定的，而不是==相等运算符。

　　while语句：

　　do/while语句：

　　for语句：

　　for/in语句：for/in语句

但要注意，在JavaScript中switch语言匹配case表达式是用===等同运算符判定的，而不是==相等运算符。

2 标签语句：给语句或语句块命名，常用于语句跳转和引用。

break语句：

　　continue语句：

　　var语句：

　　function语句：

　　return语句：

　　throw语句：在JavaScript中，当发生运行时错误或程序明确地使用throw语句时就会抛出异常(exception)，是用try/catch/finally语句可以捕捉异常(这点很像Java的异常机制)。

　　try/catch/finally语句： 空语句 ；：空语句是不会执行任何操作的，但人们在实践中发现，空语句在创建一个具有空主体的循环时是很有用的。

16 JavaScript 词法结构

1 字符集： JavaScript程序用的是Unicode字符集。由于ASCII编码和Latin-1编码都是Unicode编码的子集，所以用这两种编码写的JavaScript程序都是绝对有效的。

2 大小写敏感性： JavaScript是一种区分大小写的语言。需要注意的一点是，HTML并不区分大小写，而HTML经常会和JavaScript一起使用，所以要注意不要把二者的这一特性混淆使用。

3 可选的分号，在JavaScript中，为分隔语句，在简单语句后的分号（；）是可选的，为了保持良好的编程习惯和增加代码的可读性，强烈建议养成使用分号的习惯。

4 注释：JavaScript的注释和Java的注释非常类似，“//”作为行注释，“ /* ”和“ */ ”之间的所有内容都被注释。

5 直接量：所谓直接量，就是程序中直接显示出来的数据值。

6 标识符：所谓标识符，就是一个名字，通常用来命名变量、函数等。JavaScript中的标识符命名规则同Java等多种语言一样，第一个字符必须以字母、下划线(_)或美元符号($)。此外，ECMAScript v3标准中还允许标识符中有Unicode转义序列。所谓Unicode转义序列，使字符/u后接4个十六进制数字，用来指定一个16位的字符编码。

7 保留字：同许都其他语言一样，JavaScript中预留了许多保留字。包括

　　JavaScript关键字：　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　               break 　 do 　if 　switch　 typeof 　case 　else　 in 　this 　var 　catch 　false　instanceof 　throw 　void　 continue　 finally 　new 　true 　while 　default　 for 　null 　try 　with 　delete function 　return

8 ECMA扩展保留关键字：                                                                                                                                            abstract 　double 　goto　 native　 static 　boolean　 enum　 inplements package 　super 　byte 　export 　 import 　private 　synchronized 　char 　extends　 int 　protected　 throws 　class　 final　 interface 　 public　 transient　 const 　float　 long 　short 　volatile 　debugger

9 要避免使用的其它标识符：其中包括应避免使用的JavaScript预定义的全局变量名或全局函数             arguments 　encodeURL 　Infinity 　Object 　String 　Array 　Erros 　isFinite 　parseFloat 　SyntaxError 　Boolean 　escape 　isNaN 　parseInt 　TypeError 　Date 　eval 　Math 　RanqeError 　underLoed 　decodeURI 　EvalError　 NaN 　ReferenceError 　unescape　 decodeURICompoment 　Function 　Number　 RegExp

javascript基础部分的更多相关文章

  1. JavaScript基础

    JavaScript基础 JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处 ...

  2. 一步步学习javascript基础篇（0）:开篇索引

    索引: 一步步学习javascript基础篇(1):基本概念 一步步学习javascript基础篇(2):作用域和作用域链 一步步学习javascript基础篇(3):Object.Function等 ...

  3. 前端之JavaScript基础

    前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript历史 1992年Nombas开发出C ...

  4. 一步步学习javascript基础篇（3）：Object、Function等引用类型

    我们在<一步步学习javascript基础篇(1):基本概念>中简单的介绍了五种基本数据类型Undefined.Null.Boolean.Number和String.今天我们主要介绍下复杂 ...

  5. Javascript基础回顾 之(三) 面向对象

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  6. Javascript基础回顾 之(二) 作用域

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  7. Javascript基础回顾 之(一) 类型

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  8. JavaScript 基础回顾——对象

    JavaScript是基于对象的解释性语言,全部数据都是对象.在 JavaScript 中并没有 class 的概念,但是可以通过对象和类的模拟来实现面向对象编程. 1.对象 在JavaScript中 ...

  9. javascript基础01

    javascript基础01 Javascript能做些什么? 给予页面灵魂,让页面可以动起来,包括动态的数据,动态的标签,动态的样式等等. 如实现到轮播图.拖拽.放大镜等,而动态的数据就好比不像没有 ...

  10. javascript基础02

    javascript基础02 1.数据类型 数据类型的描述在上篇的扩展中有写到链接 由于ECMAScript数据类型具有动态性,因此的确没有再定义其他数据类型的必要.这句话很重要. 如果以后再数据类型 ...

随机推荐

  1. 如何评价苹果中国官网 iOS 8 介绍页面的文案「开发者的大事、大快所有人心的大好事」？[转自知乎]

    在什么是「苹果式中文」答案中,小七得出了这个结论: 「苹果式中文」是指句子结构破碎,经常缺乏主语,滥用排比,顶真,偏正短语,和不恰当四字词的广告文体. (有关什么是苹果式中文,小七原来贴错地方了TAT ...

  2. 在同台电脑上再次安装MySql需要注意的事项

    今天安装了一下mysql,出现的问题主要是在最后一步: msyql 安装到最后一步 start service 错误解决方法 1, 到控制面板里面先把 mysql 删除 . 2. 到 c 盘 C:\P ...

  3. LPTHW 笨办法学python 33章

    32-33章节 将for-loop和while-loop循环的. 俩种句法就不说了.简单说下个人对于for和while的理解. 我觉得他learn python the hard way这里的写法是, ...

  4. iOS学习之iOS沙盒(sandbox)机制和文件操作之NSFileManager(三)

    1.在Documents里创建目录 创建一个叫test的目录,先找到Documents的目录, NSArray *paths = NSSearchPathForDirectoriesInDomains ...

  5. day27_反射

    1.反射-概述(掌握) 反射就是在程序运行过程中,通过.class文件动态的获取类的信息(属性,构造,方法),并调用 注意:JAVA不是动态语言,因为动态语言强调在程序运行过程中不仅能获取并调用类里面 ...

  6. eclipse常用插件

    1. eclipse安装主题插件:http://www.eclipsecolorthemes.org/ 2. eclipse terminal插件:在eclipse中集成终端,使用非常方便,不用单独打 ...

  7. UML(一) 类图及类间关系

    原创文章,同步发自作者个人博客,http://www.jasongj.com/uml/class_diagram/ UML类图 UML类图介绍 在UML 2.*的13种图形中,类图是使用频率最高的UM ...

  8. JavaScript侧边悬浮框

    <script> window.onscroll=function(){ var oDiv=document.getElementById('div1'); var scrollTop=d ...

  9. C#中web页面之间传递数组参数

    一直以来用到的都是在url地址中传递string类型,那么如果是数组类型的该怎么传递呢? ]; arryStr[] = "a"; arryStr[] = "b" ...

  10. python 使用总结

    本人原来是编写java的,后来转到编写ios之后,最后又来编写python了.相对于其他的一些开发人员来说,我精通的语言还是比较杂的. 这里将几个语言进行类比,比较一些个人的看法的东西. 首先obje ...