Javascript & DHTML 实例编程(教程)基础知识


Posted in Javascript onJune 02, 2007

[ 2007-04-11 14:31:50 | Author: never-online ] 
这一节首先请下载JScript.chm这本手册,无论新手老手,有一本手册是免不了的,特别是对于新手,如果你没有空翻犀牛书,那么这本手册将是你了解这门语言的首选。下面所讲的大多数,手册上可以没有提及,或提及很少的内容。

以下的教程都是针对你对上面所说的JScript.chm这本手册了解的基础上而写的,如果你还没有看过JScript.chm,建议你先下载,边看手册,边看教程。

JS的语法与大多数类C的语言差不多的语法,差别只在它本身的特性上面。所以语法的具体内容,我不再多写,多看看手册应该明白的。

JS五大对象:String, Number, Boolean, Object, Function。

JS四种循环:
for(var i=0; i<n; i++) {}
do {} while(true);
while(true) {}
for (var i in collection) {}

异常处理:
try {} catch(aVariable){}

JS语法我就不一一列举了,这里只JS的几大对象进行一些说明,手册也许是没有说到的。

一、字符串。
字符串是最常用的。而强制转换成字符串的方式至少有几下两种:
1、用字符串连接符"+"号。+号在JS里如果是运算就是加,如果是字符串,就是拼接,比如:
<script>
var a_number = 1000
var a_string = a_number + "";
</script>

2、用String强制转型(String)。
<script>
var a_number = 1000
var a_string = String(a_number);
</script>
在这里要注意一点,上面说的是强制转型,String前是没有"new"关键字的。如果加上new 关键字,那么得到的将是一个String对象。对象可以包含属性和方法,而字符串不能,以下可以做一个比较:
<script>
var a_number = 1000
var a_string = String(a_number);
a_string.property = "js";
alert(a_string.property) //将提示undefined

var a_object = new String(a_number)
a_object.property = "js";
alert(a_object.property) //将提示js
</script>
所以,有new和没有new是有区别的。这一点在Number,Boolean里都是如此,所以关于这样的转型,在以后中将不再多说。

二、数字(Number)。
这里也说一说转型的问题。
除了可以用Number来强制转型外,也可以用parseInt, parseFloat来转成整型或者浮点型。如果转型后不是数字,那么,将返回NaN(Not a Number),这个时候可以用isNaN函数来判断,这里你可以查一下手册,看看里面的语法。顺便记一下这个函数。

三、布尔型(Boolean)。
这一个就较麻烦一些了,因为JS里对它的处理比较奇特。
除了JScript手册上所说的:“
一个值为 true 或者 false 的表达式。如果需要,非 Boolean 表达式也可以被转换为 Boolean 值,但是要遵循下列规则: 

所有的对象都被当作 true。 
当且仅当字符串为空时,该字符串被当作 false。 
null 和 undefined 被当作 false。 
当且仅当数字为零时,该数字被当作 false。 
”以外,还应该注意:

首先,在没有强制转换成布尔型之前,也就是非true或者也非false的时候
1、在数字条件判断中,一般情况下就是三种情况:0,负数,正数,只要是非0就是true,下面是示例。
<script>
var a = 0;
var b = -1;
var c = 1;

function assert (aVar) {
if (aVar) alert(true);
else alert(false);
}
assert(a) // false
assert(b) // true
assert(c) // true
</script>
注意:上例中的条件判断是直接判断条件语句的,如果我们把条件语句改成:
<script>
var a = 0;
var b = -1;
var c = 1;

function assert (aVar) {
if (aVar==true) alert(true);
else alert(false);
}
assert(a) // false
assert(b) // false
assert(c) // true
</script>
负数会有截然不同的结果。

2、在字符串中,也需要注意
<script>
function assert (aVar) {
if (aVar) alert(true);
else alert(false);
}

var a="undefined";
var b="false";
var c="";

assert(a) // true
assert(b) // true
assert(c) // false
</script>

注意:上例中的条件判断是直接判断条件语句的,如果我们把条件语句改成:
<script>
function assert (aVar) {
if (aVar==true) alert(true);
else alert(false);
}

var a="undefined";
var b="false";
var c="";

assert(a) // false
assert(b) // false
assert(c) // false
</script>
也会有截然不同的结果。因此,在处理这方面问题的时候要小心。

也许有些朋友看到这里就会有点晕了,那么怎么样才能像手册中所说,只有"",0,null,undefined这些才能是false呢?方法至少有两种:

(一)、强制转型:
  1、用上面所说过的Boolean(aVar)来转型。
  2、用“非运算符”来转型。比如上例
    <script>
    function assert (aVar) {
    if (!!aVar==true) alert(true);
    else alert(false);
    }

    var a="undefined";
    var b="false";
    var c="";

    assert(a) // true
    assert(b) // true
    assert(c) // false
    </script>
    两个取反,将aVar转成Boolean型,相当于Boolean(aVar)。

(二)、全等运算符。
全等运算符是三个等于"===",这与上面所说的不同,它只进行同类型的比较。就上例所说,它只比较的是true或者false,如果与字符串或数字等比,都是false,只有与true相比,才是true。举例:
<script>
function assert (aVar) {
if (aVar===true) alert(true);
else alert(false);
}

var a="undefined";
var b=true;
var c=1;

assert(a) // false
assert(b) // true
assert(c) // false
</script>

四、对象(Object)。
JS创建对象有至少以下两种方法:

1、如上所说,用new关键字。比如new Number(100),new String("string"),new Object(),new customFunction()等。
这种方法在手册上有很详细的说明,这里就不再多说。

2、还可以用花括号括起来。比如
var o = { 
  m1:'never-online.net',
  m2:'blog' 
}
这种方法就比较省时省力了。利用这种方法来创建对象,需要注意的就是,
每个成员后有一个":"冒号,冒号后是该成员的内容。
其次就是,成员内容后有一个逗号",",但仅最后一个成员是没有逗号的。

五、函数(Function)。
函数在JS里的作用有两个,
一是做为一个普通函数一样被调用。
二是可以做为一个"类"(class)来使用。
第一条就没有什么可说明的了,手册上说得很清楚了,第二条就简要说明一下。
上面第四点里说到对象,除了创建JS本身的对象之外,需要创建一个类的实例,那么就必须先把“类”写出来。这个类就是Function。
比如:
<script>
function myclass() {
  this.m1="member--m1";
  this.m2="member--m2";
}
var o = new myclass();
</script>

六、关于this和new关键字。

也许有些朋友还不太清楚这个this的作用是什么。这是面向对象里所提及的内容

这里也简单说一下,this就是“自己”的意思,而上面的的“自己”,就是指myclass。
举个例子来说myclass这个类就是一个模具,模具上有一个名字(m1),还有一个螺丝(m2),而new关键字就可以理解成“生产”。那么就可以把上面的代码理解成:

(模具 myclass)function myclass() {

(模具myclass的名字是)this.m1="member--m1"
(模具myclass上面的螺丝是)this.m2="member--m2";
}

按照模具myclass的样式生产一个产品o
var o= new myclass();

这个刚出炉的产品就有模具myclass的所有特性了。当然,我们可以按照这个模具的样式生产成千上万个。

如果我们愿意,我们还可以修改一下他的属性,比如,我生产完一个产品,想把他的名字换了。我们也可以这么做

var product = new myclass();
product.m1 = "newProduct"

上面这样讲解,希望能清楚一些。

基本把要说的基础知识简单的说了一些,JS的基础知识其实也有很多,知道有疏忽,但是又不便多写,写多了就烦琐了,只有走一步看一步了,看看还有什么不清楚的,才能再写出来了 

Javascript 相关文章推荐
js apply/call/caller/callee/bind使用方法与区别分析
Oct 28 Javascript
基于Jquery的温度计动画效果
Jun 18 Javascript
关于捕获用户何时点击window.onbeforeunload的取消事件
Mar 06 Javascript
推荐40个非常优秀的jQuery插件和教程【系列三】
Nov 09 Javascript
jquery实现鼠标滑过显示提示框的方法
Feb 05 Javascript
PHPMyAdmin导入时提示文件大小超出PHP限制的解决方法
Mar 30 Javascript
javascript:void(0)点击登录没反应怎么解决
Nov 13 Javascript
分享javascript计算时间差的示例代码
Mar 19 Javascript
JavaScript深度复制(deep clone)的实现方法
Feb 19 Javascript
Bootstrap CSS组件之按钮下拉菜单
Dec 17 Javascript
canvas实现图像布局填充功能
Feb 06 Javascript
微信小程序canvas绘制圆角base64图片的实现
Aug 18 Javascript
把JS与CSS写在同一个文件里的书写方法
Jun 02 #Javascript
JavaScript 不只是脚本
May 30 #Javascript
JCalendar 日历控件 v1.0 beta[兼容IE&amp;Firefox] 有文档和例子
May 30 #Javascript
[原创]站长必须要知道的javascript广告代码
May 30 #Javascript
JSON 学习之完全手册 图文
May 29 #Javascript
Highslide.js是一款基于js实现的网页中图片展示插件
Mar 30 #Javascript
JScript的条件编译
May 29 #Javascript
You might like
解析在apache里面给php写虚拟目录的详细方法
2013/06/24 PHP
PHP根据传来的16进制颜色代码自动改变背景颜色
2014/06/13 PHP
php+MySQL判断update语句是否执行成功的方法
2014/08/28 PHP
解决PHP里大量数据循环时内存耗尽的方法
2015/10/10 PHP
JQuery 无废话系列教程(二) jquery实战篇上
2009/06/23 Javascript
JavaScript 学习笔记(五)
2009/12/31 Javascript
编写js扩展方法判断一个数组中是否包含某个元素
2013/11/08 Javascript
js实现每日自动换一张图片的方法
2015/05/04 Javascript
jquery常用函数与方法汇总
2015/09/01 Javascript
JavaScript中数组的合并以及排序实现示例
2015/10/24 Javascript
深入理解jQuery()方法的构建原理
2016/12/05 Javascript
Bootstrap php制作动态分页标签
2016/12/23 Javascript
原生js实现可拖动的登录框效果
2017/01/21 Javascript
SVG描边动画
2017/02/23 Javascript
vue与bootstrap实现简单用户信息添加删除功能
2019/02/15 Javascript
详解JavaScript中的强制类型转换
2019/04/15 Javascript
[55:44]OG vs NAVI 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
Python的Django框架中模板碎片缓存简介
2015/07/24 Python
使用C#配合ArcGIS Engine进行地理信息系统开发
2016/02/19 Python
python之virtualenv的简单使用方法(必看篇)
2017/11/25 Python
python批量查询、汉字去重处理CSV文件
2018/05/31 Python
关于python2 csv写入空白行的问题
2018/06/22 Python
python读取xlsx的方法
2018/12/25 Python
Python元组常见操作示例
2019/02/19 Python
对python特殊函数 __call__()的使用详解
2019/07/02 Python
Tensorflow安装问题: Could not find a version that satisfies the requirement tensorflow
2020/04/20 Python
如何导出python安装的所有模块名称和版本号到文件中
2020/06/05 Python
Algenist奥杰尼官网:微藻抗衰老护肤品牌
2017/07/15 全球购物
澳大利亚家居用品零售商:Harris Scarfe
2020/10/10 全球购物
学习十八大报告感言
2014/02/28 职场文书
十佳标兵事迹材料
2014/08/18 职场文书
放飞理想演讲稿
2014/09/09 职场文书
2014法院四风问题对照检查材料思想汇报
2014/10/04 职场文书
大学生党性分析材料
2014/12/19 职场文书
董事长致辞
2015/07/29 职场文书
小学生大队委竞选稿
2015/11/20 职场文书