JavaScript的基本语法

时间:2021-10-08 20:07:10

http://blog.sina.com.cn/s/blog_6e44dfbf0100noal.html

JavaScript的基本语法

    JavaScript语言同其他语言一样,有自身的基本数据类型、表达式和运算符以及基本的程序框架。

一、基本数据类型

    在JavaScript中有四种基本数据类型

    数字型:整数和实数

    字符串型:用“”号或‘’括起来的字符或数值

    逻辑型:用True或False表示

    空值:表示什么也没有

    在JavaScript的基本数据类型中的数据可以是常量,也可以是变量。由于JavaScript采用弱类型形式,因而一个数据的变量或常量不必首先声明,而是在使用或赋值时确定其数据的类型。当然也可以先声明该数据的类型,它是通过在赋值时自动说明其数据类型。

二、JavaScript中的控制结构和循环

     1、if语句,if......else语句

     2、switch....case 语句

     3、for 循环语句

     4、break 、continue 语句

     5、标签语句 和with 语句

    在这里主要涉及一下标签语句和with语句,其他几种语句类型和C#是一样的。

    标签语句:

     随着JavaScript 1.2版本的出台,该语言提供了一种使使用Continue和Break语句更有效的办法,标签语句可以放置在任何控制结构之前,这些控制结构能够嵌套其他的语句。它可以使您跳出条件语句和循环语句,而转到你程序中的其他位置。在下面的程序中您可以看到该语句的用法。

    <html>

       <head>

           <title> JavaScript Unleashed</title>

       </head>

       <body>

        <script language="Javascript 1.2" type="text/javascript">

          <!--

              //变量声明

              var stopX=4;

              var stopY=9;

              document.write("所有在(0,0)和(");

              docunment.write(stopX+","+stopY+")的x,y组合有:<br>");

             loopX:

               for(var x=0;x<10;++x){

                 for(var y=0;y<10;++y) {

                   document.write("("+x+","+y+")");

                     if((x==stopX)&&(y==stopY))

                      {

                       break loopX;

                       

                   }

                 document.write("<br>");

                }

               document.write("<br>循环完成后x="+x);

               document.write("<br>循环结束后y="+y);

           -->

        </script>

       </body>

    </html>

   在本例中,for循环被贴上了用户自定义loopX标签,不管程序如何嵌套,它都能跳出或继续for循环。如果没有标签语句,break语句就只终止产生y值的循环。

    with 语句:

    有了With语句,在存取对象属性和方法时就不用重复指定参考对象。在With语句块中,凡是JavaScript不识别的属性和方法都和该语句指定的对象有关。With语句的语法格式如下所示:

    with(object){

       Statements

       }

    对象指明了当语句组中对象缺省时的参考对象。这里我们用较为熟悉的Document对象对With语句举例。

    例如:当使用与Document 对象有关的write( )或writeln( )方法时往往使用如下形式:
          document.writeln( Hello! )

如果需要显示大量数据时就会多次使用同样的document.writeln 语句。这时就可以像下面的程序那样,把所有以Document 对象为参考对象的语句放到With 语句块中,从而达到减少语句量的目的。下面是一个With 语句使用的例子:

    <html>

       <head>

         <title>JavaScript Unleashed</title>

      </head>

      <body>

         <script type="text/javascript">

         <!--

            with(document){

             write("您好");

             write(" <br>这个文档的标题是:\""+title+"\".");

             write("<br>这个文档的URL是:"+URL);

             write("<br>"现在您不用每一次都写出document对象的前缀了);

             }

           -->

           </script>

      </body>

    </html>

      这样,您在使用document的方法和属性的时候就可以去掉Document前缀。程序中的title和URL均是Document对象的属性。一般情况下应写作document.title和document.URL。



http://www.cnblogs.com/BeginMan/p/3435187.html

Js概述

here
大神级别谈Javascript编程风格

语法结构

1.字符集:Unicode(ASCII与Latin-1的超集)
2.区分大小写
3.注释:///*..*/
4.直接量:程序中直接使用的数据值,如1,'ab',true,/ad/,null等
5.标识符和保留字
6.可选分号:如果语句语法正确,且独占一行,可以省略其后的分号。

类型、值和变量

类型:

Javascript的数据类型分为两类:原始类型和对象类型 
原始类型:数字,字符串,布尔值;

JavaScript有两个特殊的原始值:null(空)、undefined(未定义)

对象类型:处理数字、字符串、布尔值、null和undefined之外都是对象了,对象是属性的集合,每个属性都由“名/值对”(值可以是原始类型的值,也可以是对象)构成。有一个特殊的对象就是全局对象。

数组:普通的JavaScript对象是无序集合,JavaScript同样定义了一个特殊的对象-数组,表示带索引的有序集合。
函数:js还定义了另一个特殊对象-函数,函数是具有与它相关联的可执行代码的对象。
:如果函数用来初始化(使用new运算符)一个新建的对象,我们称之为构造函数,每一个构造函数定义了一类(Class)对象——由构造函数初始化的对象组成的集合。类可以看作对象类型的子类型,有如下类:数组(Array)类、函数(Function)类、日期(Date)类、正则(RegExp)类、异常(Error)类。同时也可以自定义类。

注意:js类型可以分为原是类型和对象类型,也可以分为拥有方法的类型和不能拥有方法的类型,同样可以分为可变类型和不可变类型。如对象和数组就是可变类型,js可以更改对象的属性值和数组元素的值,数字,字符串,布尔值,null和undefined属于不可变类型。
智能类型转换:js可以*的进行数据类型转换,如使用字符串的地方使用了数字,则会自动将数字转换成字符串。

数字:

和其他编程语言不同的是,js不区分整数值和浮点数值,JavaScript所有数字均用浮点数表示。
关于数值的运算,这里参考Math对象

字符串:

注意\n用来分割行。
关于转义:在js中,反斜杠(\)有着特殊的用途,反斜杠符号后加一个字符,就不再表示它们的字面含义了。如:\n表示一个换行符。\'表示单引号(或撇号)。如:var str = 'you\'re right!';
更多介绍见字符串方法

布尔值:

任意的js的值都可以转换成布尔值,下面的值会转换成false:

nullundefined0-0NaN""

所有其他值包括对象(数组)都会转换成true

Null和Undefined

Null:是js的关键字,它表示一个特殊值,常用来描述空值。

alert(typeof(null));        // 输出object

这说明了null是一个特殊的对象值,含义是"非对象"。
undefined:是预定义的全局变量,和null不一样,不是关键字。它的值就是“未定义”。

alert(typeof(undefined));   //undefined

注意:尽管null和undefined是不同的,但是它们都表示“值的空缺”,两者可以互换,它们都是假值,和false类似,null和undefined都不包括任何属性和方法。

alert(null == undefined);   //true
alert(null === undefined); //false
if(!null){ //null:false
if(!undefined){ //undefined:false
alert(0); //0
}
}

如果你想将它们赋值给变量或属性,或将它们作为参数传入函数,最佳选择就是null.
扩展阅读:“关于javascript中的NaN、undefined

全局对象

全局对象是对象的一个特殊,在前面讲过。全局对象(global object)在js中有着重要的用途;全局对象的属性是全局定义的符号,在js程序中直接使用,当js解释器启动时(或者任何web浏览器加载新页面时),它将创建一个新的全局对象,并给它一组定义的初始属性。

全局属性:undefined、Infinity、NaN
全局函数:isNaN()、parseInt()、eval()
构造函数:Date()、RegExp()、String()、Object()、Array()
全局对象:Math、JSON
在代码的最顶层,不在任何函数内的Js代码可以使用关键字this来引用全局对象:

var global = this;
alert(global); //[object Window]

在客户端中,在其表示的浏览器窗口中所有的Js代码中,Window对象充当了全局对象,引用其自身window属性

包装对象

对象通过.符号引用属性值,当属性值是一个函数的时候,称其为方法,通过o.m()来调用o对象中的方法。

但是奇怪的是,字符串也具有同样的属性和方法,如:

var str = 'hello world';
var word = str.substring(str.indexOf(" ")+1,str.length); //使用字符串的属性

疑问:字符串既然不是对象,为什么它会有属性呢?
注意:只要引用了字符串str的属性,js就会将字符串值通过new
String(str)
的方式转换成对象,这个对象继承了字符串的方法,并被用来处理属性的引用,一旦属性引用结束,这个新创建的对象便被销毁。

同字符串一样,数字和布尔值也具有各自的方法,通过Number()和Boolean()构造函数创建一个临时对象,这些方法的调用均来自这些临时对象。

null和undefined没有包装对象。

var s = 'BeginMan';
alert(s.length); //引用了字符串的属性,便创建了一个临时对象。 输出:8
s.len = 4; //给它设置了一个属性,上面说过一旦引用其属性就会创建临时对象,赋值后,然后销毁了。
var t = s.len; //查询这个属性,这个属性自然不存在。
//当运行这段代码时,t的值是undefined,

这段代码说明,在读取字符串、数字和布尔值的属性值(或方法)的时候,表现的像对象一样,但如果你视图给其属性赋值,则会忽略这个操作,因为修改发生在临时对象身上,而这个临时对象并未继续保留下来。

定义:存取字符串、数字和布尔值的属性时创建的临时对象成为包装对象。可以通过String()、Number()、或Boolean()构造函数显式创建包装对象。

var s = 'abc',n=1,b=true;
var S = new String(s); //一个字符串对象
var N = new Number(n); //一个数值对象
var B = new Boolean(b); //一个布尔对象
alert(s == S); //true
alert(s === S); //false
alert(typeof(S)); //object

不可变的原始值和可变的对象引用

1、不可变:
js原始值也就是上面说的原始类型(undefined、null、字符串、数字、布尔值),它们都是不可变的,比如说修改一个数字本身就是说不通的,但是字符串看起来没那么明显,因为字符串是字符组成的数组,通过修改数组达到修改字符串,但是在js中禁止这样,虽然看上去修改了字符串但是其实返回的是一个新的字符串值

var s = 'hello';    
s.toUpperCase(); //返回'HELLO',但是并没有改变s的值
alert(s); //返回 hello

比较:原始值的比较是值的比较,对于字符串比较,只有当它们长度相等,且每个索引的字符相等,js才认为它们相等。
2、可变:
对象是可变的,它们的值是可修改的:

var o = {x:1};      //定义一个对象
o.x = 2; //通过修改对象属性值来更改对象
o.y = 3; //给它增加一个新属性

var a = [1,2,3]; //数组也可修改
a[0] = 5;
a[4] = 10;

比较:对象的比较并非值比较,即使两个对象包含相同的属性和值,各个索引元素相同的两个数组也不相等。

var a = {x:1},b = {x:1};        //具有相同属性和值的两个对象
alert(a === b); //false,两个单独的对象永不相等
alert(a == b); //false
var c = [1,2,3] , b=[1,2,3]; //两个长度和索引元素都相等的数组
alert(c === b); //false,两个单独的数组永不相等
alert(c == b); //false

通常我们将对象称为引用类型,对象的值都是引用,对象的比较都是引用比较,当且仅当它们引用同一个基对象时,它们才相等。

var a = [];     
var b = a; //变量b引用同一个数组
b[0] = 1; //通过变量b修改引用的数组
alert(a[0]); // a也会修改,这里输出 1
alert(a === b); //true 引用同一个基对象

类型转换

var a = 10+'abcd';  //在数值类型中 +表示相加,在字符串中+表示连接字符串操作
alert(typeof(a)); //string
var b = 10-'abcd'; //但是-在字符串中就不能表示连接字符串了,而代表算术运算符-
alert(typeof(b)); //number
alert(b); //NaN

JavaScript的基本语法


转换和相等性
在转换过程中 ==在判断两个值是否相等的情况下做出了类型转换,而恒等===并未做出任何类型转换。
显式类型转换
显式类型转换是为了更广泛的需求,在包装对象中说到:当通过new运算符,通过String()/Number()/Boolean()构造函数显式创建包装对象。如果我们没有使用new运算符,则它们就会作为类型转换函数。

Number('3');        //3
String(false); //'false'或通过false.toString()
Boolean([]); //true
Object(3); // new Number(3)

除了null和undefined之外的所有值都具有toString()方法,这个方法和String()一样。
parseInt()parseFloat():它们是全局函数,不从属任何类的方法

parseInt()parseFloat()会跳过任意数量的前导空格,尽可能解析更多的数字字符串并忽略后面的内容,如果第一个非空格字符是非法的数字直接量,将会返回NaN

parseInt('2 birds');            //2
parseFloat('2.4 meters'); //2.4
parseInt(-12.54); //-12
parseFloat('.1'); //0.1
parseInt('.1'); //NaN 整数不能以.开始
parseFloat('$34.54'); //NaN 数字不能以$开始

关于对象转换成原始值:

有两种方法:toString()返回字符串;valueOf()返回对象本身(自身内部表示)。
更加详尽还是看看《JavaScript权威指南6版》

变量声明

var i,sum;
var i = 0,j = 0,k = 0;

关于动态类型和静态类型编程语言:

JavaScript的基本语法

变量作用域

作用域:scope
函数中,同名的局部变量的优先级高于全局变量,会默默地……覆盖掉全局变量。

var scope = 'yes';
function changeScope(){
var scope = 'no'; //地头蛇来了,同名的全局变量虎落平阳被犬欺
return scope;
}
alert(scope); // yes 灾难尚未降临
alert(changeScope()); // no:调用之然后局部变量就夭折了
alert(scope); // yes 冲出了黑夜……

注意:尽管全局变量声明可以去掉讨厌的var,但是声名局部变量必须带上安全套(val).测试下:

var scope = 'yes';
function changeScope(){
scope = 'no'; //一不小心就修改了全局变量
return scope;
}
alert(scope); // yes 灾难尚未降临
alert(changeScope()); // no:调用之然后才发现没有局部变量,却是全局变量,灾难慢慢逼近……
alert(scope); // no 淹没在黑夜……

推荐阅读:

1.整理 JS变量作用域

检测一下……
JavaScript的基本语法


2.Js作用域链及变量作用域

1.关于作用域、作用链
2.javascript 没有var的变量都为全局变量,且为window对象的属性

文章同步在http://beginman.cn/


http://blog.sina.com.cn/s/blog_75a8cfac0100pif0.html

javascript定义对象写法

 (2011-04-11 13:38:44)JavaScript的基本语法转载
标签: 

杂谈

分类: javascript

javascript定义对象的几种简单方法

1.构造函数方式,全部属性及对象的方法都放在构造方法里面定义

优点:动态的传递参数

缺点:每创建一个对象就会创建相同的方法函数对象,占用大量内存

function User1(name, password) {
this.name = name;
this.password = password;
this.login = function(name,password){
if(this.name == name && this.password == password) {
return true;
}else {
return false;
}
};
}

2.原型方式,将对象属性及方法定义都写在对象的prototype里面

优点:每次创建对象时都是使用相同prototype中的方法,不会占用重复的内存

缺点:无法动态传递构造参数

function User2() {

}
User2.prototype.name = "prototype name";
User2.prototype.password = "prototype password";
User2.prototype.login = function(name,password){
if(this.name == name && this.password == password) {
return true;
} else {
return false;
}
};
原型方式的另一种写法:
格式:
var 对象名 = {};
    对象名.prototype.变量1=变量1的值;
    对象名.prototype.变量2=变量2的值;
    ……;
    对象名.prototype.函数1= function() {
       函数体
    };
    对象名.prototype.函数2= function() {
       函数体
    };
    ……;
说明:
(1)       初始对象体内可以不定义任何东西;
(2)       在要定义的变量前加“对象名.prototype.”的格式;
(3)       对象的内容与值以等号分隔,成对出现;
(4)       包含的变量或者函数之间以分号分隔,也可以省去分号。
(5)       函数需要写在function(){}的大括号之内。
例子:
var data = {};
   data.prototype. name ="Vicky”;
    data.prototype. age =20;
    data.prototype. eat = function() {
       alert(‘I wanna eat meat’);
    };
    data.prototype. sleep= function() {
       alert(‘I wanna sleep’);

};

3.构造及原型混合方式,将属性定义写在构造方式里面,方法写在prototype里面

优点:综合了construct及prototype方式的优点,可以动态传递构造参数,并且方法函数对象也只创建一个

缺点:函数写在对象外面,不太符合面向对象的思想

function User3(name,password) {
this.name = name;
this.password = password;
}
User3.prototype.login = function(name,password) {
if(this.name == name && this.password == password) {
return true;
} else {
return false;
}
};

4.动态原型方式:加一个判断属性,来判断该对象是否已经被创建过,如果被创建过,则方法就不在构建

优点:将原型函数写在对象定义里面

缺点:不支持继承

function User4(name,password) {
this.name = name;
this.password = password;
if(typeof User4.__initialized == "undefined") {
User4.prototype.login = function(name,password){
if(this.name == name && this.password == password) {
return true;
} else {
return false;
}
};
User4.__initialized = true;
}
}

5、JSON方式/对象直接量

格式:
var 对象名 = {
             变量1: 变量1的值,
             变量1: 变量1的值,
             ……,
            函数1: function() {
                函数体
            },
            函数2: function() {
                函数体
            }//Note:最后的逗号要去除为了和IE兼容。
};
说明:
(1)       大括号内直接填写变量或者函数;
(2)       对象的内容与值以冒号分隔,成对出现;
(3)       包含的变量或者函数之间以逗号分隔;
(4)       函数需要写在function(){}的大括号之内。
例子:
var  对象名 = {
       name:    “Vicky”,
       age:     26,
       eat: function() {
              alert(‘I wanna  eat meat’);
       },
       sleep: function() {
              alert(‘I wanna sleep’);
        }
};
注释:类似的方式也叫做匿名类
匿名类举例:    
{
    index: '//',
    reg: new RegExp('^//.*$'),
    css: "comment"
}
上面的方式创建了类,只是没赋给一个变量而已。

6、create方式

该方式利用了Prototype JavaScript组件库。
格式:
       var 对象名 = Class.create();
       Object.extend(对象名.prototype, {
            变量1: 变量1的值,
            变量1: 变量1的值,
             ……,
            函数1: function() {
                     函数体
                },
            函数2: function() {
                     函数体
            },
……
});
说明:
(1)       对象的创建使用了Prototype库中的Class.create()函数;
(2)       对象的内容使用Prototype库中的Object.extend()函数来扩展;
(3)       被扩展的对象在传入Object.extend函数时一定要带上prototype,
(4)       扩展内容被大括号包含,其内与JSON方式的定义格式完全相同。
例子:
       var data = Class.create();
       Object.extend(dta.prototype, {
       name: "Vicky",
       age: 20,
       eat: function() {
              alert(‘I wanna eat meat’);
       },
       sleep: function() {
              alert(‘I wanna sleep’);
       }
       });

      其实,JS对象的定义还有其它的方式,你也可以用上面几种进行组合定义,这显出了JS作为动态语言的*性。
JS对象的创建正规方法如下:
var d1 = new Data();

       JS对象变量的引用方式有两种:
(1)       点号方式引用,如,data.name。
(2)       数组方式引用,如,data[‘name’]


http://blog.163.com/shilei_nb/blog/static/5187289320071012404278/

javascript面向对象编程的学习---对象继承  

继承,通俗地说,之前你写过一些类,这些类中有一些是而你现在要写的类的功能的子集或者基本相同,那么你不用完全重新写一个新的类,你可以把之前写的类拿过来使用.这样的一种代码重用过程就叫做继承.
    深入学习javascript继承之前,先了解下面的几个概念:
        父类:被继承的类
        子类:由继承得来的类
        超类:也就是父类
        抽象类:一般不用来实例化的类,它的用途是用来给其他类继承.
        基类:提供给其他类可以继承的类
        派生类:由基类继承而来的类

    javascript对象继承通常有下面的5种方式:
        1.对象冒充
        2.call()方式
        3.apply()方式
        4.原型链
        5.混合方式
    
    A.对象冒充
        所谓对象冒充,就是新的类冒充旧的类(旧的类必须采用构造函数方式),从而达到继承目的.
        eg.1
            function people(name,sex,age){    //使用构造函数方式
                this.name=name;
                this.sex=sex;
                this.age=age;
                this.say=function(){
                    alert("My name is "+this.name);
                };
                this.doing=function(){
                    alert("I am speaking");
                };
            }
            var Marry=new people("Marry","Woman","23");
            Marry.say();
            Marry.doing();
            
            function white_people(name,sex,age){
                this.inherit=people;
                this.inherit(name,sex,age);
                delete this.inherit;
                
                this.area=function(){
                    alert("I am in Europe");
                }
            }
            var Tom=new white_people("Tom","man","21");
            Tom.say();
            Tom.area();
            alert(Tom.age);
        上面的例子中,people是用来做white_people的基类,记住这个格式是用来对象冒充达到继承目的的
                this.inherit=people;            //冒充
                this.inherit(name,sex,age);        //继承
                delete this.inherit;            //删除继承
        所有新属性和新方法都必须再删除了继承后定义,这样是为了避免覆盖父类的相关属性和方法.
        另外,对象冒充支持多继承.
        eg.2
            function worker(pay,work){
                this.pay=pay;
                this.work=work;
            }
            function city_worker(name,sex,age,pay,work){
                this.inherit=people;
                this.inherit(name,sex,age);
                delete this.inherit;
                
                this.inherit=worker;
                this.inherit(pay,work);
                delete this.inherit;
            }
            
            var Jerry=new city_worker("Jerry","man","21","$1000","coder");
            Jerry.say();
            alert(Jerry.work);
        对象冒充有一个不足的地方:多继承机制实现时,如果基类存在相同的属性或者方法,将从后面的类继承.
        
    B.call()方式
        只是封装的对象冒充的一个函数.这样,我们不再需要写"经典"的三句话,而是用下面这句话代替:
            基类.call(对象,参数列表)
        eg.1
            function farmer(name,sex,age,pay,work){
                people.call(this,name,sex,age);
                worker.call(this,pay,work);
            }
            
            var Nicholas=new farmer("Nicholas","man","27","$3000","irrigator");
            Nicholas.say();
            alert(Nicholas.pay);
        同样,call()存在同名属性和方法的小问题.
        
    C.apply()方式
        和call()一样.apply()也是对象冒充的一个封装函数.其格式为:
            基类.apply(对象,参数数组);
        eg.1
            function white_collar(name,sex,age,pay,work){
                people.apply(this,new Array(name,sex,age));
                worker.apply(this,[pay,work]);
            }
            
            var Jiessie=new white_collar("Jiessie","woman","26","$2500","editor");
            Jiessie.say();
            alert(Jiessie.work);
        同样,apply()存在同名属性和方法的小问题.
        
    D.原型链
        上面三种方式都是采用构造函数方式的继承,对应地,也具有原型函数方式的继承:原型链.
        eg.1
            function blue_collar(){
            }
            blue_collar.prototype.name="Jean";
            blue_collar.prototype.age="33";
            blue_collar.prototype.say=function(){
                alert("my name is "+ this.name);
            };
            
            function city_blue_collar(){
            }
            city_blue_collar.prototype=new blue_collar();
            
            var jj=new city_blue_collar;
            jj.say();
        原型链也具有了原型链的缺点:不能传递参数.另外,原型链不支持多继承,因为
        
    E.混合方式
        使用构造函数方式来写类的属性,对属性的继承采用call()或者apply()
        使用原型方式来写的方法,对方法的继承采用原型链
        eg.1
            function beauty(name,age){
                this.name=name;
                this.age=age;
            }
            beauty.prototype.say=function(){
                alert("小女叫"+this.name);
            };
            
            function china_beauty(name,age,area){
                beauty.call(this,name,age);
                this.area=area;
            }
            china_beauty.prototype=new beauty();
            china_beauty.prototype.from=function(){
                alert("我来自"+this.area);
            };
            
            var diaochan=new china_beauty("貂禅","16","临洮");
            diaochan.say();
            diaochan.from();
            alert(diaochan.age);