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);

}

秒客网

03 Javascript初识

相关文章