js面向对象编程(js面向对象编程的缺点)

2023-11-29 09:32:05 数码极客 bianji01

 

JS好学吗?

js并不难学。

Js给人那种感觉的原因多半是因为它如下的特点:

A:本身知识很抽象、晦涩难懂,如:闭包、内置对象、DOM。

B:本身内容很多,如函数库、对象库就一大堆。

C:混合多种编程思想。它里面不但牵涉面向过程编程思想,又有面向对象编程思想,同时,它的面向对象还和别的编程语言(如:C++,JAVA,PHP)不大一样。就好像又是新的一样,让你对曾经学的面向对象产生了怀疑......

D:辛苦学习后又看似和实际应用脱节。通常学了很久的js基础之后,变量、函数、对象你也都略知一二,但一到公司开发项目的时候,却又难以下手。因为公司在开发实际项目的时候通常都是直接用它的衍生库,如:jquery,angular,boostrap,amaze,layui,ueditor等,而这些库又多如牛毛,同时还有自己的难点。让你都不知该学哪个好,甚至都怀疑自己学的是不是js了,好像有多个版本的js一样,总是学不完......

那么,怎么才能在js领域内学的轻松甚至游刃有余呢?我总结了一些实战意义的js学习经验:

1.首先要紧紧抓住它的地位

时刻都不能忘记,否则很容易犯“一叶障目不见泰山”的错误。不要学了很久就知道js是编程语言,就是写代码,而且特点就是乱七八糟就完了,那样是学不好js的。要时时抓住它的地位,确切的说是它在整个Web中的地位:它属于前端的核心,主要用来操控和重新调整DOM,通过修改DOM结构,从而来达到修改页面效果的目的。要用这个中心思想去指导后续的一切js的学习,并且形成条件反射。

2.要有一条清晰的学习路线

这个只能是过来人给你提供参考了。我的学习路线如下:

A:js基础部分,如:定义变量、函数、数组、字符串等的处理,内置函数、内置对象等;

B:js面向过程编程思想,封装出各个函数,试着用这些去做一些常见的小功能,如:选项卡、自定义多选按钮、自定义播放器、3D幻灯片;

C:js面向对象编程思想,试着去封装一些你自己的对象,提供出有意义的接口出来;

D:学了上述的内容,然后学常用的库,这里必须学jquery;

E:学基于jquery之上的常见插件,如:bootstrap,Layer,富文本编辑器等;

F:综合应用上面的多种库写实际项目的模板,多写几套。

3.从多角度去学习和领悟

充分调动你所学的东西,从多角度去做某一功能,如:以前你是从面向过程角度做的,现在改为从面向对象的角度再来做,或者继续做成可以直接使用的插件,提供属性、方法等出来。争取让你做的这个功能逐渐能使用到实际项目中来。这样的好处:既综合应用了你的所学,又能有实际意义。

4.注意培养信心

此时的你,不适合一来就看很复杂很炫的网页效果的源代码,也不适合一来就学jquery,angular,vue,bootstrap这些东西。这些内容包含了很多深奥的知识在里面,在没有任何基础的情况下直接学这些,会严重打击你的自信心。而此时你是弱小的,你需要的是培养信心,而不是反过来,否则结局很可能是“夭折”,离学有所成也就遥遥无期了。

5.多写总结

这种总结不但包括源代码、显示效果截图,还应该很容易犯的错误和对应的解决方法以及最后一两句精简的结论性语句。对自己写的总结不是写完了就了事了,要多回顾、多改进、多精简。到做项目的时候,应该是看里面的一两句话就知道是讲什么了,而不要再去看长篇大论了。

6.构建知识导图

这个可以让你越学越清晰,你可以按你喜欢的任何形式去做,只要自己印象深刻就行。

注意:知识导图也应该是经常修改、修正,让它更合理、更清晰。

学习编程知识,就来北京尚学堂,优秀的师资和多年的编程教育经验,会让你在学习的道路上快人一步。

凭什么js基于对象呢?

JS是一门基于对象、事件驱动编程的客户端脚本语言。为什么JS不是面向对象的语言?因为面向对象包括三大特征:封装、继承、多态。JS中只有封装,继承也只是模拟继承,谈不上面向对象。所有说,在JS中,一切都是对象,属性、数组、函数等等都是对象。

如何快速掌握JavaScript面向对象编程

自从有了ajax这个概念,javascript作为ajax的利器,其作用一路飙升。javascript最基本的使用,以及语法、浏览器对象等等东东在这里就不累赘了。把主要篇幅放在如何实现javascript的面向对象编程方面。

?1.?用javascript实现类

??javascritpt没有专门的机制实现类,这里是借助它的函数允许嵌套的机制来实现类的。一个函数可以包含变量,又可以包含其它函数,这样,变量可以作为属性,内部的函数就可以作为成员方法了。因此外层函数本身就可以作为一个类了。如下:

functionmyclass()

{

//此处相当于构造函数

}这里?myclass就是一个类。其实可以把它看成类的构造函数。至于非构造函数的部分,以后会详细描述。

?2.?如何获得一个类的实例

?实现了类就应该可以获得类的实例,javascript提供了一个方法可以获得对象实例。即?new操作符。其实javascript中,类和函数是同一个概念,当用new操作一个函数时就返回一个对象。如下:

var?obj1=newmyclass();

?3.?对象的成员的引用

?在javascript中引用一个类的属性或方法的方法有以下三种。

?1>?点号操作符

?这是一种最普遍的引用方式,就不累赘。即如下形式:

对象名.属性名;

对象名.方法名;

?2>?方括号引用

?javascript中允许用方括号引用对象的成员。如下:

对象名["属性名"];

对象名["方法名"];?这里方括号内是代表属性或方法名的字符串,不一定是字符串常量。也可以使用变量。这样就可以使用变量传递属性或方法名。为编程带来了方便。在某些情况下,代码中不能确定要调用那个属性或方法时,就可以采用这种方式。否则,如果使用点号操作符,还需要使用条件判断来调用属性或方法。

?另外,使用方括号引用的属性和方法名还可以以数字开头,或者出现空格,而使用点号引用的属性和方法名则遵循标示符的规则。但一般不提倡使用非标示符的命名方法。

?3>?使用eval函数

?如果不希望使用变量传递变量或方法名,又不想使用条件判断,那么eval函数是一个好的选择。eval接收一个字符串类型的参数,然后将这个字符串作为代码在上下文中执行,返回执行的结果。这里正是利用了eval的这一功能。如下:

alert(eval("对象名."+element.value));?

?4.?对对象属性,方法的添加、修改和删除操作

?javascript中,在生成对象之后还可以为对象动态添加、修改和删除属性和方法,这与其它面向对象的语言是不同的。

?1>?添加属性和方法

?先创建一个对象,空对象创建后没有任何属性和方法,然而我们可以在代码中创建。

varobj1=newobject();

//添加属性

obj1.id=1;

obj1.name="johnson";

//添加方法

obj1.showmessage=function()

{

alert("id:"+this.id+",name:"+this.name);

}

?2>?修改属性与方法

?与添加属性和方法类似,例如接着上面的例子:

//修改属性

obj1.id=2;

obj1.name="amanda";

//修改方法

obj1.showmessage=function()

{

alert("id:"+this.id");

}?

?3>?删除属性与方法

?直接将要删除的属性或方法赋值为undefined即可:

obj1.id=?1;

obj1.name=undefined;

obj1.showmessage=undefined;

?5.?创建无类型对象。

?类似于c#3.0里的anonymous?types,javascript?也可以创建无类型的对象。形式如下:

varobj1={};

varobj2=

{

id:1,

name:"johnson",

showmessage:function()

{

alert("id:"+this.id+"name:"+this.name);

}

}

?这里定义了两个无类型的对象,obj1和obj2。其中obj1是一个空对象。obj2包括两个属性id,?name和一个方法showmessage。每个属性和方法用逗号分割。属性(方法)名和其值之间用分号分割。

?用这种方式创建属性方法时,也可以用字符串定义属性方法的名字。如:

varobj2=

{

"id":1,

"name":"johnson"

}

?6.?prototype

?每个函数对象都具有一个子对象prototype,因为函数也可以表示类,所以prototype表示一个类的成员的集合。当new?一个对象时,prototype对象的成员都会被实例化成对象的成员。先看一个例子:

functionmyclass()

{}

myclass.prototype.id=1;

myclass.prototype.name="johnson";

myclass.prototype.showmessage=function()

{

alert("id:"+this.id+"name:"+this.name);

}

varobj1=newmyclass();

obj1.showmessage();?使用prototype对象创建类有一个好处。如果将所有的成员直接写在类的声明中,如下:

functionmyclass()

{

//添加属性

this.id=1;

this.name="johnson";

//添加方法

this.showmessage=function()

{

alert("id:"+this.id+",name:"+this.name);

}

}

varobj1=newmyclass();

varobj2=newmyclass();?在上面的代码中,定义了一个类myclass,在类中直接定义了两个属性和一个方法。然后实例化了两个对象,这里的两个属性和一个方法,每创建一次myclass对象都会被创建一次,浪费了内存空间。而用prototype以后就可以解决这个问题,每new一个函数时,其prototype对象的成员都会自动赋给这个对象,当new多个对象时不会重复创建。

?由于prototype的初始化发生在函数体执行之前,用以下代码可以证明:

functionmyclass()

{

//此处相当于构造函数

this.id=1;

this.name1?=this.name;

this.showmessage();

}

myclass.prototype.name="johnson";

myclass.prototype.showmessage=function()

{

alert("id:"+this.id+",name:"+this.name);

}

varobj1=newmyclass();

?执行以上代码可以发现当new这个类型的对象时,即弹出了对话框。

?最后只得一提的是,prototype有一个方法,在面向对象的设计中用得到。即:constructor属性,是对构造函数的调用,这里的构造函数即上文提到的类的声明里的代码。如:

functionmyclass()

{

//此处相当于构造函数

alert("thisisinconstructor");

}

myclass.prototype.constructor();

varobj1=newmyclass();?执行以上代码你会发现对话框弹出了两次。由此可见,prototype可专门用于设计类的成员,实际上在javascript面向对象的设计中,很多时候都会用到prototype。

如何用javascript写一个面向对象的程序

给你推荐个我觉得还算是面向对象的编程教程!JS从糊涂到明白 - 一步一步编写计算器 由浅入深快速进阶

声明:易趣百科所有作品(图文、音视频)均由用户自行上传分享,仅供网友学习交流。若您的权利被侵害,请联系315127732@qq.com
广告位招租
横幅广告