JavaScript学习笔记记录我的旅程
更新时间：2012年05月23日 22:16:40 作者：
JavaScript和Java没有直接的关系，唯一的关系就是JavaScript原名LiveScript，后来吸取了Java的一些特性，升级为JavaScript，JavaScript有时被简称为JS
1、什么是JavaScript?
(1) HTML只是描述网页长相的标记语言，没有计算，判断能力，如果所有计算，判断(比如判断文本框是否为空，判断两次密码是否输入一致)店铺放到服务器端执行的话网页的页面会非常的慢，用起来也很难用，对服务器的压力也很大，因此要求能在浏览器中执行一些简单的运算，判断，JavaScript就是一种在浏览器端执行的语言。
(2) JavaScript和Java没有直接的关系，唯一的关系就是JavaScript原名LiveScript，后来吸取了Java的一些特性，升级为JavaScript，JavaScript有时被简称为JS。
(3) JavaScript是解释性语言，无需编译就可以随时执行，这样哪怕语法有错误，没有语法错误的部分还是能够正确的执行。
JS的开发环境
(1) VS中JavaScript，Jqery的自动完成功能。
(2) JS是非常灵活的动态语言，不像C#等静态语言那样严谨。
JS入门
(1)
复制代码 代码如下:
<script type="text/javascript">
alert(new Date().toLocaleDateString());
</script>
(2) JavaScript代码放到<script>标签中，<script>可以放到<head>,<body>等任意位置，而且可以有不止一个<script>标签。alert函数是弹出消息窗口，new Date()是创建一个Date类的对象，默认值就是当前的时间。
(3) 放到<head>中的<script>在body加载之前就已经运行了，写在body中的<script>是随着页面的加载而一个个的执行的。
(4) 除了可以再页面中声明JavaScript之外，还可以将JavaScript写在单独的JS文件中，然后在页面中引入：<script src=”common.js” type=”text/javascript”></script>。声明到单独的JS文件的好处是多页面也可以共享，减少网络流量。
事件
(1) <a href="javascript:alert('Hello')">点击我</a>
<a href="javascript:void(0)">我就不弹出东西</a><br />
<a href="JSoop.htm" onclick="alert('您确认你要跳转吗？')">单击我</a>
(2) JavaScript中也有事件的概念，当按钮被点击的时候
1) <input type="button" value="单击我" onclick="alert('终于单击我了')" />
2) 只有超链接的href中的JavaScript中才需要”JavaScript:”，因为他不是事件，而是把”JavaScript:'看成像”http:”，”ftp:”，”thunder://”，ed2k://，mailto://一样的网络协议，交由JS解析引擎处理，只有href中这一个特列。
JS变量
(1) JavaScript中既可以使用双引号声明字符串，也可以使用单引号声明字符串，主要是方便和HTML集成，避免转义符的麻烦。
(2) var i=10; //声明一个变量，名字为i，指向10这个整数，一旦指向10，i就是int类型， alert(i);
(3) JavaScript中有null，underfined两种，null表示变量的值为空，underfined则表示变量还没有指向任何的对象，未初始化。
(4) JavaScript是弱类型，表示变量的时候无法：int i=10.只能通过var i=10;声明变量，和C#中的var不一样，不是C#中的那样的类型推断。
(5) JavaScript中也可以不用var声明变量，直接用，这样的变量是”全局变量”，因此除非确实想用全局变量，否则使用的时候最好加上var。
(6) JS是动态类型的，因此var i=10;i=”abc”是合法的。
JavaScript
(1)
复制代码 代码如下:
var sum = 0;
for (var i = 0; i <= 100; i++) {
sum = sum + i;
}
alert(sum);
(2) 如果JavaScript中的代码有语法错误，浏览器会弹出报错信息，查看报错信息就能帮助排查错误。
(3) JavaScript的调试，使用VS可以很方便的进行JavaScript的调试，调试时需要注意几点：
1) IE的调试选项要打开，Internet选项-高级，去掉”禁用脚本调试”前的勾选。
2) 以调试方式运行界面。
3) 设置断点，监视变量等操作和C#一样。
判断变量初始化
(1) JavaScript中判断变量，参数是否初始化的三种方法。
复制代码 代码如下:
var r;
if (r == null) { if (typeof (r) == "undefined") { if (!x) {
alert("null"); alert("undefined"); alert("不X");
}
}
}
注：推荐用最后一种方法
函数的声明
(1) JavaScript中声明函数的方法：
复制代码 代码如下:
function Add(i1, i2) {
return i1 + i2;
}
(2) 不需要声明返回值类型，参数类型，函数定义以function开头
复制代码 代码如下:
var r = Add(10, 20);
alert(r);
var r = Add("tom，", "您好");
alert(r);
(3) JavaScript中不像C#中那样要求所有路径都有返回值。
匿名函数
(1)
复制代码 代码如下:
var f1 = function sum(i1, i2) {
return i1 + i2;
}
alert(f1(10, 20));
(2) 类似于C#中的匿名函数。
(3) 这种匿名的用法在Jquery中用法特别多。
(4)
复制代码 代码如下:
alert(function sum(i1, i2) {
return i1 + i2;
} (100, 10));
注解：C#中匿名函数使用委托来调用。
JS面向对象基础
(1) JavaScript中没有类的语法，是用函数闭包(closure)模拟出来的，下面讲解的时候还是用C#中的类，构造函数等概念，JavaScript中string，date等”类”都被叫做”对象”，JavaScript中声明类(类不是类，是对象)。
(2)
复制代码 代码如下:
function Person(name, age) { //声明一个函数，当成类用
this.Name = name;
this.Age = age;
this.SayHello = function () {
alert("你好，我是" + this.Name + ",我今年：" + this.Age + "岁了");
}
}
var p1 = new Person("韩迎龙", "23");
p1.SayHello();
(3) 必须要声明类名，function Person(name,age)可以看做是声明构造函数，Name,Age这些属性也是使用者动态添加了。
Array()对象
(1) JavaScript中的Array对象就是数组，首先是一个动态数组，而且是一个像C#中数组ArrayList，Hashtable等的超强综合体。
(2)
复制代码 代码如下:
var names = new Array();
names[0] = "韩迎龙";
names[1] = "得到";
names[2] = "说的";
for (var i = 0; i < names.length; i++) {
alert(names[i]);
}
(3) 无需预先制定大小，动态。
Array()练习1
(1) Array练习，求出一个数组中的最大值。
复制代码 代码如下:
<script type="text/javascript">
function MyMax(arr) {
var max = arr[0];
for (var i = 0; i < arr.length; i++) {
if (arr[i] > max) {
max = arr[i];
} }
return max;
}
var arr = new Array();
arr[0] = 20;
arr[1] = 10;
arr[2] = 34;
alert(MyMax(arr));
</script>
Array()练习2
(1) 将一个字符串数组的元素的顺序进行反转，{3,9,5,34,54}{54,34.5.9.3}。不要使用JavaScript中的反转函数，提示：第i个和第length-i-1进行交换，定义函数。
复制代码 代码如下:
<script type="text/javascript">
function MyReverse(arr) {
for (var i = 0; i < arr.length / 2; i++) {
var temp = arr[i];
arr[i] = arr[arr.length - i - 1];
arr[arr.length - i - 1] = temp;
}
}
var arr = new Array();
arr[0] = "3";
arr[1] = "9";
arr[2] = "5";
arr[3] = "34";
arr[4] = "54";
alert(arr);
MyReverse(arr);
alert(arr);
Array()练习3
(1) 将一个字符串数组输出为|分割的形式，比如：韩迎龙|试试|订单。不要使用JavaScript中的Join函数，arr.join(1)将数组用分割符链接成一个字符串。
复制代码 代码如下:
<script type="text/javascript">
function MyJoin(arr) {
if (arr.length <= 0) {
return;
}
var s = arr[0];
for (var i = 1; i < arr.length; i++) {
s = s + "|" + arr[i];
}
return s;
}
var arr = new Array();
arr[0] = "韩迎龙";
arr[1] = "试试";
arr[2] = "订单";
alert(MyJoin(arr));
//第二种方法
alert(arr.join("|"));
</script>
Array的字典用法
(1) JS中的Array是一个宝贝，不仅是一个数组，还是一个Dictionary，还是一个Stack。
(2)
复制代码 代码如下:
var names = new Array();
names["人"] = "ren";
names["扣"] = "kou";
names["手"] = "shou";
alert(names["人"]);
alert(names.人);
for (var k in names) {
alert(k);
}
(3) 像Hashtable,Dictionary那样用，而且像他们一样的效率高。
Array()的简化声明
(1) Array还可以有简化的方式
var arr=[3,4,5,6,7]; //普通数组初始化
这种数组可以看做是names[“人”]=”ren”;的特例，也就是key为0,1,2,3,4,5
(2) 字典风格的简化创建方式
var arr={”tom”=30,”jim=”30};
数组，for和其它
(1) 对于数组风格的Array来说，可以使用join方法拼接为字符串。
复制代码 代码如下:
var arr = ["tom", "jim", "kencery"];
alert(arr.join(",")); //JS中join是array的方法，不像.net中是string的方法
(2) for循环可以像C#中的foreach一样的使用。
复制代码 代码如下:
for (var e in document) {
alert(e);
}
相关文章
JavaScript对HTML DOM使用EventListener进行操作
这篇文章主要介绍了JavaScript对HTML DOM使用EventListener进行操作的方法,用于向HTML元素中添加事件,需要的朋友可以参考下2015-10-10
在本篇文章里小编给大家分享的是关于JS中delete运算符的基础知识点，有需要的朋友们跟着学习下。2019-11-11
Object3D似乎是Three.js框架中最重要的类，相当一部分其他的类都是继承自Object3D类，比如场景类、几何形体类、相机类、光照类等等：他们都是3D空间中的对象，所以称为Object3D类,需要了解的朋友可以参考下2012-12-12
适配器模式可以根据需求转换(或调整)一个接口,创建含有您所需接口的另一个对象,并将它连接到您想改变接口的对象,从而完成这种转换,下面就来详解JavaScript实现设计模式中的适配器模式的方法2016-05-05
在网络或书籍所说的JavaScript大部分指客户端JavaScript。2009-09-09
这篇文章主要介绍了在JavaScript中操作数组之map()方法的使用,是JS入门学习中的基础知识,需要的朋友可以参考下2015-06-06
这篇文章主要介绍了Javascript字符串对象的常用方法简明版,本文用一个代码例子列表了Javascript字符串对象的一些常用方法,例如加粗、斜体、删除线、上标、下标、大小写、查找字符、替换字符等,需要的朋友可以参考下2014-06-06
input按钮的事件处理大全,收集的是网页中常用的一些事件处理，需要的朋友可以收藏下。2010-12-12
js取得url地址参数实例，需要的朋友可以参考一下2013-02-02
MyBatis是一款一流的支持自定义SQL、存储过程和高级映射的持久化框架。MyBatis几乎消除了所有的JDBC代码，也基本不需要手工去 设置参数和获取检索结果,对MyBatis感兴趣的小伙伴们可以参考一下2015-09-09
最新评论