03 Javascript初识

Javascript语言（★★★★★）

     Javascript是基于对象和事件驱动的脚本语言，作用在客户端。
              特点： * 交互性 * 安全性（不能访问本地的硬盘)   * 扩平台性（浏览器就能解析js)
                   
      javascript和java根本不同
          Netscape（网景）     开发livesrcipt（javascript前身）
                    java语言，升级内核，（改名livescript改成javascript）                   
                    微软（巨头）开发一套语言（jscript）                   
                    弹劾：微软 SUN ECMA（欧洲计算机制造协会）
                   
                    ECMASciprt（标准）                   
                          * javascript是基于对象，java是面向对象。
                          * javascript是解析可以执行，java先编译再执行。
                          * javascript是弱类型语言，java是强类型语言。
                   
               * javascript的组成
                    * ECMAScript（标准）
                    * BOM（Browser Object Model）     浏览器对象模型
                    * DOM（Document Object Model） 文档对象模型         
         
          * javascript与html的结合方式(★★★★)
               * js与html的结合方式（自己编写）
               * html提供了标签，<script type="text/javascript">js的代码</script>，
              
               * 引入外部文件的方式（工具类）
                    * 需要先有一个js的文件（.js结尾的）
                    * 引入到html页面中，<script type="text/javascript" src="xx.js"></script>

                   
               * 注意：如果script的标签引入了外部的文件，那么script内部js代码就不会被执行。              
               * 可以放在页面的任意位置上

               * 外部文件不能包含 <script> 标签。

---

Javascript语法
     Javascript的注释: 单行和多行注释

JavaScript 语句

     是发给浏览器的命令。这些命令的作用是告诉浏览器要做的事情。

     在JavaScript 标准，浏览器把行末作为语句的结尾, 通常要在每行语句的结尾加上一个分号。大多数人都认为这是一个好的编程习惯. 

变量和javascript原始数据类型    
          * 定义变量，需要使用一个关键字(var)，并且声明任何类型的变量，都使用该关键字。

               可以直接不声明直接使用

               可以重复定义

               可以这个赋值数字,下次赋值String,再下次赋值null都没问题

 

      可以理解为五大类
     * Undefined、Null、boolean、number 和 string
          * String字符串类型: 单引号和双引号都代表字符串
          * Number数字类型:  不区分整数和小数
          * Boolean布尔类型
          * Null代表空，一般情况下给引用赋值
          * Undefined 未定义（当声明一个变量，而没有赋值）
                             
 * typeof(变量)，判断变量是什么类型.                

---

Javascript运算符号

     1.算术运算符: 用于执行变量与/或值之间的算术运算。

          '+'    '-'    '*'    '/'    '%'    '++'    '--'

        注意:  0或者null都代表是false，非0或者非null代表是true，默认用1表示。 

     2.赋值运算符

          '='   '+='   '-='   '*='   '/='   '%='

     3.特殊的用于字符串连接的'+'

          如果把数字与字符串相加，结果将成为字符串。

     4.比较运算符

          '!='   '>'  '>='   '<'   '<='

           ==     （只比较值）

           ===   （比较值和类型）

     5.逻辑运算符(与 和 或 要用双符号)

          '&&'   '||'   '!'

     6.唯一的条件运算符

          variablename=(condition)?value1:value2 

---

if else语句

     If 语句 

     If...else 语句 

     If..else if...else 语句 

 

Switch 语句

     如果希望选择执行若干代码块中的一个，可以使用switch 语句.

 

with语句

     with(对象) {} : 可以确定对象所使用的范围, 在范围内可以直接使用指定对象的属性和行为, 而不用对象的形式调用, 简化了对象的操作.

 

JavaScript的for循环, do while循环, 和while循环 和Break语句, Continue语句不再赘述.

---

JavaScript 中创建三种消息框：警告框、确认框、提示框。

     1.警告框

               经常用于确保用户可以得到某些信息.当警告框出现后，用户需要点击确定按钮才能继续进行操作。

          语法: 

               alert(文本)    //可以在其中加入'\n' 得到换行效果

               

     2.确认框

               确认框用于使用户可以验证或者接受某些信息.当确认框出现后，用户需要点击才能继续进行操作。如果用户点击确认，那么返回值为 true。否则返回值为 false。

          语法:

               confirm(文本)

               

     3.提示框

               提示框经常用于提示用户在进入页面前输入某个值. 当提示框出现后，用户需要输入某个值，然后点击确认或取消按钮才能继续操纵. 如果用户点击确认，那么返回值为输入的值。如果用户点击取消，那么返回值为 null。

          语法:

               prompt("文本","默认值");

               

---

Javascript函数

     函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。将脚本编写为函数，就可以避免页面载入时执行该脚本。函数包含着一些代码，这些代码只能被事件激活，或者在函数被调用时才会执行。你可以在页面中的任何位置调用脚本（如果函数嵌入一个外部的 .js 文件，那么甚至可以从其他的页面中调用）。

     注意: 参数列表只写变量名,不用var,但是该变量只在本函数内有效, 和函数外定义var某变量作区分.

 

//动态函数 var show = new Function("x","y","var sum=x+y; return sum");

//这样写在一起也行 var show = new Function("x,y","var sum=x+y; return sum");

 

return 语句

     return 语句用来规定从函数返回的值。因此，需要返回某个值的函数必须使用这个 return 语句。

 

JavaScript 变量的生存期

     当您在函数内声明了一个变量后，就只能在该函数中访问该变量。当退出该函数后，这个变量会被撤销。这种变量称为本地变量(局部变量)。您可以在不同的函数中使用名称相同的本地变量，这是因为只有声明过变量的函数能够识别其中的每个变量。

     如果您在函数之外声明了一个变量，则页面上的所有函数都可以访问该变量。这些变量的生存期从声明它们之后开始，在页面关闭时结束

---

for...In 声明用于遍历数组或者对象的属性（对数组或者对象的属性进行循环操作）。

     语法：

          for (变量 in 对象)

          {

              在此执行代码

          }

     实例:

          

---

JavaScript 事件

     事件: JavaScript 使我们有能力创建动态页面。事件是可以被 JavaScript 侦测到的行为。

 

网页中的每个元素都可以产生某些可以触发 JavaScript 函数的事件。比方说，我们可以在用户点击某按钮时产生一个 onClick 事件来触发某个函数。事件在 HTML 页面中定义。

 

事件举例：

     鼠标点击 

     页面或图像载入 

     鼠标悬浮于页面的某个热点之上 

     在表单中选取输入框 

     确认表单 

     键盘按键 

注意：事件通常与函数配合使用，当事件发生时函数才会执行。

---

JavaScript 特殊字符

 

换行

     可以在文本字符串内部使用反斜杠对代码进行折行。下面的例子是正确的：

          document.write("Hello \

          World!")

---

JavaScript 字符串(String)对象

计算字符串的长度 

     var txt="Hello World!"

     document.write(txt.length)

为字符串添加样式 (略) 

indexOf() 方法 

如何使用 indexOf() 来定位字符串中某一个指定的字符首次出现的位置。 

match() 方法 

如何使用 match() 来查找字符串中特定的字符，并且如果找到的话，则返回这个字符。 

replace() 

     在字符串中用某些字符替换另一些字符。

          var str="Visit Microsoft!"

          document.write(str.replace(/Microsoft/,"W3School"))

---

JavaScript Date（日期）对象: 返回当日的日期和时间  

 

getDate() 返回一个月中的某一天

getDay()  返回一周中的某一天 (0~6)

getMonth() 返回月份(0~11)

getFullYear() 返回年份

 

getTime() 

     返回 1970 年 1 月 1 日至今的毫秒数

setTime()

     根据毫秒数设置时间

 

setFullYear()  

     使用 setFullYear() 得到精确的日期。 

          var d = new Date()

          d.setFullYear(1992,10,3)

          document.write(d)

     注意：表示月份的参数介于 0 到 11 之间。也就是说，如果希望把月设置为 8 月，则参数应该是 7。

 

Date.parse(datestring)

     可解析一个日期时间字符串，并返回 1970/1/1 午夜距离该日期时间的毫秒数。可以与Date对象的setTime()结合使用.但是时间显示为12:00令人不爽, 还不如以上的使用setFullYear.

 

在下面的例子中，我们将日期对象设置为 5 天后的日期：

     var myDate=new Date()    //从 Date 对象返回一周中的某一天 (0 ~ 6)

     myDate.setDate(myDate.getDate()+5)

注意：如果增加天数会改变月份或者年份，那么日期对象会自动完成这种转换。

 

toUTCString() 

     使用 toUTCString() 将当日的日期（根据 UTC）转换为字符串。

      

toLocaleString()     返回当地时间

---

Javascript数组

     定义数组: 数组对象用来在单独的变量名中存储一系列的值。

          简洁写法

               var myArray = ["nihao","butaihao"]

          使用关键词 new 来创建数组对象。下面的代码定义了一个名为 myArray 的数组对象：

               var myArray=new Array()

          也可以使用一个整数自变量来控制数组的容量：

               var mycars=new Array(3)

     使用 for...in 声明来循环输出数组中的元素。

               var array = new Array("aaa","bbb","ccc");

       for(var x in array){

                    document.write(array[x]+"<br />");

       }

     concat合并两个数组

     join方法将数组的所有元素组成一个字符串。 

          

     sort() 可直接按字母顺序

     sort() 按数值顺序,加入sortNumber函数,将函数名作为参数传入sort方法即可.

          function sortNumber(a,b)

          {

               return a - b

          }

     pop() 删除并返回数组的最后一个元素

     push() 像末位添加元素,并返回新的长度

---

Boolean（逻辑）对象用于将非逻辑值转换为逻辑值（true 或者 false）。检查逻辑对象是 true 还是 false

• 可以将 Boolean 对象理解为一个产生逻辑值的对象包装器。
• Boolean（逻辑）对象用于将非逻辑值转换为逻辑值（true 或者 false）。
• 使用关键词 new 来定义 Boolean 对象。下面的代码定义了一个名为 myBoolean 的逻辑对象：
• var myBoolean=new Boolean()

注释：如果逻辑对象无初始值或者其值为 0、-0、null、""、false、undefined 或者 NaN，那么对象的值为 false。否则，其值为 true（即使当自变量为字符串 "false" 时）！

---

Math（算数）对象

      round 方法对一个数进行四舍五入。

      floor(x) 对一个数进行下舍入。 

      random() 返回一个介于 0 和 1 之间的随机数

 

     案例: 返回一个介于 0 和 10 之间的随机数

          Math.floor(Math.random()*11);

---

JavaScript RegExp 正则对象

     var reg = new RegExp("表达式")

     var reg = /^ 表达式 $/ 

          * test(); 返回true或者false

link day01

---

Javascript全局函数

     全局对象是预定义的对象，作为 JavaScript 的全局函数和全局属性的占位符。通过使用全局对象，可以访问所有其他所有预定义的对象、函数和属性。全局对象不是任何对象的属性，所以它没有名称。全局对象只是一个对象，而不是类。既没有构造函数，也无法实例化一个新的全局对象。

eval(string)

     计算JavaScript 字符串，并把它作为脚本代码来执行。

isNaN()

     检查其参数是否是非数字值。

---

案例一: 九九乘法表

document.write("<table border='1px'>");

for(var x=1;x<10;x++){

document.write("<tr>");

for(var y=1;y<=x;y++){

document.write("<th>"+x+"*"+y+"="+x*y+"\t"+"</th>");

}

document.write("</tr>");

}

document.write("</table>");

---

字符串的trim方法模拟

function mytrim(str){

var start,end;

start = 0;

end = str.length-1;

while(start<=end && str.charAt(start)== ' '){

start++;

}

while(start<=end && str.charAt(end)== ' '){

end--;

}

return str.substring(start,end+1);

}