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 相关文章推荐
Z-Blog中用到的js代码
Mar 15 Javascript
响应鼠标变换表格背景或者颜色的代码
Mar 30 Javascript
node.js超时timeout详解
Nov 26 Javascript
JavaScript中使用Math.PI圆周率属性的方法
Jun 14 Javascript
分享jQuery封装好的一些常用操作
Jul 28 Javascript
JS获取input file绝对路径的方法(推荐)
Aug 02 Javascript
BootStrap iCheck插件全选与获取value值的解决方法
Aug 24 Javascript
React Native实现简单的登录功能(推荐)
Sep 19 Javascript
js仿京东轮播效果 选项卡套选项卡使用
Jan 12 Javascript
详解vue 实例方法和数据
Oct 23 Javascript
微信小程序--特定区域滚动到顶部时固定的方法
Apr 28 Javascript
node将geojson转shp返回给前端的实现方法
May 29 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
很好用的PHP数据库类
2009/05/27 PHP
php实现的DateDiff和DateAdd时间函数代码分享
2014/08/16 PHP
Codeigniter控制器controller继承问题实例分析
2016/01/19 PHP
php操纵mysqli数据库的实现方法
2016/09/18 PHP
微信开发之php表单微信中自动提交两次问题解决办法
2017/01/08 PHP
Laravel5.7 Eloquent ORM快速入门详解
2019/04/12 PHP
PHP设计模式(九)外观模式Facade实例详解【结构型】
2020/05/02 PHP
一个对于Array的简单扩展
2006/10/03 Javascript
创建一个复制UBB软件信息的链接或按钮的js代码
2008/01/06 Javascript
js日期联动示例
2014/05/02 Javascript
抛弃Nginx使用nodejs做反向代理服务器
2014/07/17 NodeJs
js改变style样式和css样式的简单实例
2016/06/28 Javascript
javascript实现瀑布流动态加载图片原理
2016/08/12 Javascript
jquery.Jcrop结合JAVA后台实现图片裁剪上传实例
2016/11/05 Javascript
Bootstrap导航条鼠标悬停下拉菜单
2017/01/04 Javascript
js实现音频控制进度条功能
2017/04/01 Javascript
浅谈SpringMVC中post checkbox 多选框value的值(隐藏域方式)
2018/01/08 Javascript
D3.js实现拓扑图的示例代码
2018/06/30 Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
2019/09/28 Javascript
pyqt4教程之实现windows窗口小示例分享
2014/03/07 Python
python通过scapy获取局域网所有主机mac地址示例
2014/05/04 Python
Python socket C/S结构的聊天室应用实现
2014/11/30 Python
python学习基础之循环import及import过程
2018/04/22 Python
Python中xml和json格式相互转换操作示例
2018/12/05 Python
Python线程指南分享
2019/11/19 Python
详解numpy.ndarray.reshape()函数的参数问题
2020/10/13 Python
使用Python实现音频双通道分离
2020/12/25 Python
学前教育教师求职自荐信
2013/09/22 职场文书
化妆师职业生涯规划书
2014/02/16 职场文书
四风问题个人自查剖析材料思想汇报
2014/09/21 职场文书
领导班子个人对照检查材料(群众路线)
2014/09/26 职场文书
工程承包协议书
2014/10/20 职场文书
人事聘任通知
2015/04/21 职场文书
2015年体育教师个人工作总结
2015/05/12 职场文书
2015年党员发展工作总结
2015/05/13 职场文书
使用Python开发冰球小游戏
2022/04/30 Python