`
yeak2001
  • 浏览: 101503 次
  • 性别: Icon_minigender_1
  • 来自: 无锡
社区版块
存档分类
最新评论

我的javascript的认识之一

阅读更多
    一切都是对象,这是OO里最基本的思想,很多人对javascript的误解很大,包括我自己,起初可能就认为javascript就只能做做动态的前台效果,操作操作DOM和CSS。导致了前台的js代码扎乱无章,不像后台的java或者C#来的要求高,要求写出很高质量的代码来,AJAX的出现导致了要求写很多JS代码,同时也就要求JS代码的质量,要求更多的JS来在一起合作,于是我就用了几天时间从新理解了下JS中的面向对象。
         首先要说明的是JS是面向对象的语言,很多人可能要说他是基于原型的面向对象,但我要说的是JS是基于原型,但他仍然是面向对象的。
         在JS中对象有2种,一种就是普通的对象,普通的对象又分2种,一种是从JS内置的类中实例化出的对象(Array),第二种就是对象直接量,用{开头和}结尾,中间是典型的key:value,value可以是任何类型的。第二种对象叫做函数对象,用function+函数名+或干个参数后跟大括号+函数体。第一种对象有过OO经验的人都能知道是什么意思,第二种是最费力理解的,这和OO里的方法完全不一样,如果用OO里的方法来认识JS里的函数那就犯了大错了。
         函数是定义了一次却可以调用多次或执行多次的方法,有方法名,参数,可以有任意多个参数,可以有返回值。参数的个数可以不固定,在调用函数的时候可以任意指定。有返回值的话就成了函数调用表达式的值。函数要区分定义和执行这2个完全不同的过程,定义就是function开头,加函数名、参数名、函数体,执行就是函数名后加小括号,可能有参数,可能没有。在我看来分清这一点很重要,我用个例子来说明:
                   function helloWorld(/* option*/){
                            /*do something*/

}这是定义函数
helloWorld(/*option*/);这是执行函数
函数在对象上被调用的时候这个函数就是方法,它的调用所在的对象就会作为函数的一个隐式的参数来传递(this),JS中的this关键字会让人产生摸不清头脑的时候,必须认清调用函数的时哪个对象。第二种是函数直接量,也就是匿名函数,我们可以把它赋给一个变量,然后通过变量来调用这个函数:
             var helloWorld = function(/*option*/) {/*do something*/}
匿名函数可以出现在任何地方,然后通过调用变量名后加括号来执行这个函数,也有另外一种方法来执行匿名函数:   (function (/*option*/) {/*do something*/})().函数名是一个很奇怪的东西,它的作用只是用来存储函数的一个地方,我们可以理解为变量是在内存栈中的一个地址,可以往里面存东西,也可以拿东西,我们通过把一个函数的引用存进这个变量里,然后使用这个变量去调用这个函数。所以可以把一个函数名赋给另外一个变量:var a = helloWorld;这个叫做传递函数引用,以后就可以通过a()来调用helloworld这个函数。JS中的函数不仅仅是语法,也是数据,所以我们可以把它做为参数传递,可以进行赋值操作,当给一个变量赋值一个有返回值的函数时,结果就是函数返回的值;如果没有返回值就会出现undefined,当然传递给方法做参数也是一样的,如果只是单纯的调用那个变量就会引用这个函数,而不是执行。
         函数有它自己的作用域,JS中是通过词法来划分作用域的,而不是动态的划分,通俗点说就是在定义它的作用域里,而不是执行它的作用域,超出作用域的变量是不能被调用的,因为JS中的函数就是对象,所以如果在这种对象里定义了一个变量,而你又想把他作为对象的属性来调用的话就会出现undefined,如和让函数中的变量对外可用呢,我们可以引入闭包,在JS中这是个很强大的技术,何谓闭包,很多书上写的太让人看不懂,其实很简单,就是内嵌的函数,内嵌的匿名函数,JS的函数对象里的都是私有变量,我们可以通过返回一个匿名函数来调用外部函数里面的私有变量,可能有人会说我只要返回那个变量就行了,但这不是OO的思想,OO的思想是我们一切都要从对象的角度来思考问题,一个函数就是一个对象,我们不能让一个对象返回一个值。闭包的作用就是让已经销毁超出作用域的变量继续存活。

                           
function makeProperty(o,name,predicate){
  var value;
  o["get"+name] = function(){return value;};
  o["set"+name] = function(v){
    if(predicate && !predicate(v))
         throw "set"+name+ ":invalid value "+v;
    else
         value = v;
  };
}
var o ={};
makeProperty(o,"Name",function(x){return typeof x == "string";});
o.setName("Frank");
alert(o.getName());
o.set(0) //error,set a value of the wrong type

alert(helloWorld());

闭包很强大,我对闭包的理解也很肤浅,我会在以后继续深入理解闭包。
         每个函数都有内建的几个属性,几个非常非常有用的属性,第一个是agruments,它是Agruments,这是一个特殊的属性,犀牛书上如此给他定义的:可变长度的参数列表,Argument对象是一个类似数组的对象,可以按照数目获取传递给函数的参数值,尽管在定义函数的时候参数是固定的,但是在调用的是时候可以传递任意多个参数,如果获取哪些没有在定义时定义的参数呢,就要用到agruments了,可以在一个循环里找到任意你想要的参数,如果调用时传递的参数比定义的少,没有传递的参数就是undefined的。
犀牛书上如此写到:Agruments对象有一个非同寻常的特性。当函数具有命名了的参数时,Agruments对象的数组元素是存放函数参数的局部变量的同义词。Agruments[]数组和命名了的参数不过是引用同一变量的两种不同方法。相反,用参数名改变一个参数的值同时会改变通过agruments[]数组获得的值。通过agruments[]数组改变参数的值同样会改变参数名获取的值:
function f(x){
alert(x);
arguments[0]=null;
alert(x);
}

最后记住agruments只是一个普通的JS标识符,不是保留字。除了数组元素,Agruments对象还定义了callee属性,用来应用当前正在执行的函数,当定义了一个函数直接量(匿名函数)时,我们又想对这个函数进行递归调用就可以使用这个属性了:
function (x){
if(x<=1) return 1;
return x*arguments.callee(x-1);
}
         构造函数是初始化一个对象的属性并且专门和new运算符一起使用的函数。
         function f(x,y){
                   this.x = x;
                   this.y=y;
     }

         每个函数都有一个prototype属性,它引用的是预定义的原型对象。原型对象在使用new运算符把函数作为构造函数时起作用,它在定义新的对象类型时起着非常重要的作用。一般我们会认为new一个新的对象的时候是new运算符创建一个新的对象,然后调用构造函数把新创建的对象作为this关键字的值来传递,并且调用构造函数来初始化这个对象,在JS中这并非事情的全部,在创建了一个空对象以后,new这是了这个对象的原型,一个对象的原型就是它的构造函数的prototype属性的值。当这个函数呗定义的时候,prototype属性自动创建和初始化。Prototype属性的初始值是一个对象,这个对象只带有一个属性。这个属性名叫constructor,它指回到和原型相关联的那个构造函数。添加个这个原型对象的任何属性,都会成为呗构造函数所初始化的对象的属性。这是犀牛书给出的定义。
         我谈谈自己对原型的认识,首先要说类,JS中没有真正的类这个概念,但可以这么去理解,联系到现实类就是类型,可以从这个类型中实例化出各种各样的对象,在JS中没有类,但可以通过构造函数来模拟类的功能,类中定义了一组属性和方法(对外接口),当定义一个构造函数的时候可以给这个类初始化属性和方法,这样就有产生了JS中的类,每个具体的实例对象都有自己属性(特性),燕子和小鸟都属于鸟类,但他们的特性是不同,同时他们能做的事却有可能相同,这是共性。当我们在定义构造函数的时候可以给这个类一组属性,然后在实例化的时候具体赋值,每次实例化对象都有可能不同,这个时候如果我们在这个函数里定义了一个方法,这不是不可以,但这不是最优的办法,这个时候我们就可以采用原型继承,我们把这些方法赋给原型对象的一个属性,这样每个实例化的对象都共同享有这些属性,这些属性也不会随着每个实例化对象的改变而改变,这个可以叫做静态字段,每个prototype属性或者方法是每个具体实例化对象共同拥有的,每个实例化的对象都会从原型对象里继承这些属性。





一句话概括,JS中不会有一个正式的类的名字,是通过构造函数以及原型对象来近似模拟类。
function Rectangle(w,h){
  this.withd = w;
this.height =h;
}
Rectangle.prototype.area = function() {return this.width*this.height;}

         当读取对象的属性时,先检查对象中有没有这个属性,如果有就得出结果,如果没有就去原型中找这个属性,如果有就得出结果,如果也没有就会是undefined的,当给一个属性赋值的时候,如果属性不存在,就会直接创建这个对象的属性,这个属性就只单单针对当前的这个对象,以后再用实例化这个对象的构造函数再去实例化对象的时候是不会有这个属性的。也就是说写入操作不会访问原型,如果原型中有这个属性存在了,也会创建这个对象的新属性,并且隐藏原型中的那个。
分享到:
评论

相关推荐

    Web前端开发技术-认识JavaScript的数据类型.pptx

    认识JavaScript的数据类型;学习目标;认识JavaScript的数据类型; 1.变量的数据类型;基本数据类型-数字型;认识JavaScript的数据类型;认识JavaScript的数据类型;认识JavaScript的数据类型;认识JavaScript的数据类型;...

    重新认识JavaScript

    2005年涌现了大量的JavaScript应用程序,所以了解这门语言的更为深入的特性对每一个Web开发者都是非常重要的”。大量的支持开放标准的Web框架都使用JavaScript实现,那些用户体验友好的网站几乎全部使用JavaScript...

    深入认识javascript中得eval函数

    深入认识javascript中得eval函数深入认识javascript中得eval函数深入认识javascript中得eval函数

    认识JavaScript共1页.pdf.zip

    认识JavaScript共1页.pdf.zip

    JavaScript技术练习小项目

    JavaScript技术练习小项目 该项目包含JavaScript的多项技术点,可以有效练习我们的能力,提高对js的认识 JavaScript技术练习小项目 该项目包含JavaScript的多项技术点,可以有效练习我们的能力,提高对js的认识 ...

    JavaScript的学习总结

    自己弄得一个总结文档方便初学者快速学习 csdn真恶心

    css和javascript初步认识教程

    css和javascript初步认识教程,带你进入web编程的世界,可以在工作时随时查询的经典资料。

    系统认识JavaScript正则表达式.doc

    系统认识JavaScript正则表达式.doc

    JavaScript核心概念及实践 高清PDF扫描版 (邱俊涛).pdf

    《JavaScript核心概念及实践》可以供JavaScript初学者阅读,以快速学习和掌握这门语言的核心内容:对于有一定经验的JavaScript程序员,则可以通过本书加深和拓展对JavaScript的认识,提升应用开发能力。 目录: 第1...

    JavaScript语言精粹(JavaScript.The.Good.Parts).pdf

    JavaScript语言精粹(JavaScript.The.Good.Parts).pdf 加强对javascript的认识。下载有益!

    深入理解jquery和javascript系列

    深入理解JavaScript系列,超实用的jQuery代码段,jQuery源码分析系列。

    Web前端开发技术-认识JavaScript的对象.pptx

    任务1 认识JavaScript的对象;在JavaScript中,对象是一种数据类型,它是由属性和方法组成的一个集合。属性是指事物的特征,使用“对象.属性名”访问;方法是指事物的行为,使用“对象.方法名()”进行访问。;;;利用...

    一个使用JavaScript写的星际争霸网页游戏!超牛..纯JavaScript,值得研究

    从前听李大拿说过这个是用JavaScript技术实现的小游戏,当找到这个东西并且翻看了里面的源代码之后,对JavaScript的认识更深入了一层,原来JS可以这么牛?!

    JavaScript 设计模式 azw3

    《JavaScript设计模式》是JavaScript设计模式的学习指南。全书分为14章。首先介绍了什么是模式、模式的结构、类别...通过阅读本书,他们将能够提高对设计模式的认识,并学会如何将设计模式应用到JavaScript编程语言中。

    Web前端开发技术-JavaScript的事件.pptx

    认识事件;JavaScript的事件;JavaScript的事件;JavaScript的事件; 注册和删除事件;JavaScript的事件;JavaScript的事件;JavaScript的事件;JavaScript的事件;JavaScript的事件;JavaScript的事件; 事件对象;JavaScript的...

    javascript的综合

    javascript的组合..对javascript的全面认识..

    十年JavaScript.rar

    在这个过程中,你会看到一个开发者在每个阶段对JavaScript的认识,也可以知道这本书的由来。 当然,一个人的历史,在一门语言的历史面前,甚至显得是那样的不足以道。因此除了故事性与可读性之外,对本章的前3个...

Global site tag (gtag.js) - Google Analytics