Javascript

课前说明
 内容:JaveScript语言。JavaScript语法很多和C#/JAVA/C等
语言类似,因此本课只讲JavaScript特有的语法,不会再讲解编程的基本原理
 
 
目标:掌握JavaScript语法,为Dom编程和JQuery打基础。
参考书:张孝祥《JavaScript网页开发----体验式学习教程》
 
 
什么是JavaScript
 
    HTML只是描述网页长相的标记语言,没有计算、判断能力,如果所有计算、判断(比如判断文本框是否为空、判断两次密码是否输入一致)都放到服务器端执行的话网页的话页面会非常慢、用起来也很难用,对服务器的压力也很大,因此要求能在浏览器中执行一些简单的运算、判断。JavaScript就是一种在浏览器端执行的语言。
 
   Javascript的Java没直接的关系,唯一的关系就是JavaScript原名LiveScript,后来吸收了Java的一些特性,升级为JavaScript.JavaScript有时被简称为JS
 
   JavaScript是解释型语言,无需编译就可以随时运行,这样哪怕语法有错误,没有语法错误的部分还是能正确运行。
 
2.js入门.avi
 
 
JS的开发环境
    VS中JavaScript、JQuery的自动完成功能:在VS2010中直接有,VS2008需要安装VisualStudio 2008SP1(http://www.microsoft.com/downloads/details.aspx?displaylang=zhcn&familyid=27673c47-b3b5-4c67-bd99-84e525b5ce61)和VS90SP1KB958502-x86(http://code.msdn.microsoft.com/KB958502/Release/ProjectReleases.aspx?Releaseld=1736)补丁会更强更好用。如果实在"."不出来也没关系,不影响运行。
JS是非常灵活的动态语言,不像C#等静态语言那样严谨,开发工具中的JS完成功能只是一个辅助、建议,"."出来的成员调用可能不能用,"."不出来的成员也许能调用,因此不要因为"点儿不出来"而担心代码有问题。
vs2008的HTML编辑器中触发JavaScript自动完成:Ctrl+J.
 
 
 
JS入门
    <script type="text/javascript">
alert(new Date().toLocaleDateString());
</script><script language="....>已经不推荐使用。
 
   JavaScript代码放到<script>标签中,script可以放到<head>、<body>等任意位置,而且可以有不止一个<script>标签。alert函数是弹出消息窗口,new Date()是创建一个Date类的对象,默认值就是当前时间。
   放到<head>中的<script>在body加载之前就已经运行。
 
   除了可以在页面中声明JavaScript以外,还可以将JavaScript写到单独的JS文件中,然后在页面中引入:<script src="test.js" type="text/javascript"></script>.声明到单独的js文件的好处是多页面也可以共享、减小网络流量。
 
 
4.事件
    在超链接的点击里执JavaScript:<a href="javascript:alert(88)">发发</a>
 
    JavaScript中也有事件的概念,当按钮被点击的时候也可以执行JavaScript:
<input type="button" onclick="alert(99)" value="九九"/>
只有超链接的href中的JavaScript中才需要加"javascript:",
因为它不是事件,而是把""javascript:"看成像"http:"、"ftp:"、"thunder://"、"ed2k://"、"mailto:"、一样的网络协议,交由js解析引擎处理。只有href中这是一个特例。
 
 
 
 
 
5.JavaScript变量.avi
 
   JavaScript中即可以使用双引号声明字符串,也可以使用单引号声明字符串。主要是为了方便和html集成,避免转义符的麻烦。
 
  JavaScript中有null、undefined两种,null表示变量的值为空,undefined则表示变量还没有指向任何的对象,未初始化。两者的区别参考资料。
 
  JavaScript是弱类型,声明变量的时候无法:int i=0; 只能通过 var i=0;声明变量,和C#中的var不一样,不是c#中那样的类型推断。
 
   JavaScript中也可以不用var声明变量,直接用,这样的变量是"全局变量",因此除非确实想用全局变量,否则使用的时候最好加上var.JS是动态类型的,因此var i=0;i="abc";是合法的。
 
 
6.JavaScript调试.avi
 
JS出错与调试
   如果JavaScript中的代码有语法错误,浏览器会弹出报错信息,查看报错信息就能帮助排查错误。
 
   JavaScript的调试,使用VS可以很方便的进行JavaScript的调试,调试时需要注意几点:
   IE的调试选项要打开,internet选项-->高级,去掉"禁用脚本调试"前的勾选。
   以调试方式运行网页。
   设置断点、监视变量等操作和C#一样。
   案例:用循环语句的方法计算1到100之间整数的和。
 
 
7.JS判断变量初始化.avi
判断变量初始化
JavaScript中判断变量、参数是否初始化的三种方法:
var x;
if(x==null)
{
alert("null");
}
if(typeof(x)=="undefined")
{
alert('undefined');
}
if(!x){
alert('不x');
}
 
 
if(x){}//变量被初始化了或者变量不为空或者比变量不为0.
 
推荐用最后一种方法。
 
 
函数的声明
 
JavaScript中声明函数的方式:
function add(i1,i2)
{
return i1+i2;
}
不需要声明返回值类型、参数类型。函数定义以function开头。
var r=add(1,2);
alert(r);
r=add("你好","tom");
alert(r);
JavaScript中不像C#中那样要求所有路径都有返回值。
 
 
9.匿名函数.avi
 
var f1=function(i1,i2)
{
return i1+i2;
}
alert(f1(1,2));
类似于C#中的匿名函数。
这种匿名函数的用法在JQuery中的非常多。
 
 
JS面向对象基础(*)
 
JavaScript中没有类的语法,是用函数闭包模拟出来的,下面讲解的时候还是用C#中的类、构造函数的概念,JavaScript中String、Date等"类"都被叫做"对象",挺怪,方便初学者理解,不严谨。JavaScript中声明类:
function Person(name,age){
this.name=name;
this.age=age;
this.SayHello=function(){
alert("你好,我是"+this.name+",我"+this.age+"岁了");
}
}
var p1=new Person("tom",20);
p1.SayHello();
必须要声明类名,function Person(name,age)可以看做是声明构造函数,Name、Age这些属性也是使用者动态添加了。
 
 
11.Array对象1.avi
 
Array对象
JavaScript中的Array对象就是数组,首先是一个动态数组,而且是一个像C#中数组、ArrayList、Hashtable等的超强综合体。
var anames=new Array();
names[0]="tom";
names[1]="jerry";
names[2]="lily";
for(var i=0;i<names,length;i++)
{
alert(names[i]);
}
无需预先制定大小,是动态的。
 
 
12.Array练习1.求最大数.avi
练习:
求一个数组中的最大值。定义成函数。
将一个字符串数组的元素的顺序进行反转。{"3","a","8","haha"}
{"haha","8","a","3"}.
不要使用JavaScript中的反转函数。提示:第i个和第length-i-1个进行交换。定义成函数。
将一个字符串数组输出为|分割的形式,比如"梅西|卡卡|郑大世"
.不要使用JavaScript中的Join函数。arr1.join("|")将数组用分隔符链接成一个字符串。
 
 
16.Array的字典用法.avi
 
JS中的Dictionary
 
JS中的Array是一个宝贝,不仅是一个数组,还是一个Dictionary,还是一个Stack.
var pinyins=new Array();
pinyins["人"]="ren";
pinyins["口"]="kou";
pinyins["手"]="shou";
 
alert(pinyins["人"]);
alert(pinyins.人);
像Hashtable、Dictionary那样用,而且像它们一样效率高。
 
课下练习:网页版的火星文翻译。
17.Array的简化声明
Array还可以有简化的创建方式
var arr={3,5,6,8,9},普通数组初始化。
这种数组可以看做是pinyins["人"]="ren";的特例,也就是key为0、1、2....
字典风格的简化创建方式:
var arr={"tom":30,"jim":20};
 
18.用for获得对象的成员.avi
 
数组、for及其他
 
对于数组风格的Array来说,可以使用join方法拼接为字符串
var arr={"tom","jim","lily"};
alert(arr.join("."));
//JS中join是array的方法,不像.Net中是string的方法for循环
还可以获得一个对象所有的成员
for(var e in document){
alert(e);
}
有了它没有文档也可以进行开发。
 
 
原文地址:https://www.cnblogs.com/fanhongshuo/p/3812305.html