当前位置:首页 » 编程软件 » js面向对象编程

js面向对象编程

发布时间: 2022-05-12 23:31:46

① 如何用javascript面向对象编程

经常看到一些JavaScript的代码脏乱得无法理解,到处都是属性和方法,或者一个循环套着一个循环。但如果使用面向对象就能很好的理清代码,并方便理解和修改代码。如果你不希望自己的代码只有上帝理解的话,就请尽量考虑使用面向对象的模式。
译文正文:
到处都是属性、方法,代码极其难懂,天哪,我的程序员,你究竟在做什么?仔细看看这篇指南,让我们一起写出优雅的面向对象的JavaScript代码吧!
作为一个开发者,能否写出优雅的代码对于你的职业生涯至关重要。随着像Node.js这类技术的发展,你甚至可以在服务器端使用JavaScript了。同样的,你也可以使用JavaScript来控制MongoDB的持续数据存储
文本标记
文本标记只是JavaScript里创建对象的一种方法,当然这里肯定不止这一种,但它是你在只打算创建一个对象实例时的首选方法。
var bill = {};

上面的代码并不实用,它只是一个空对象。接下来我们动态地向这个对象中添加一些属性和方法。
bill.name = "Bill E Goat"; bill.sound = function() { console.log( 'bahhh!' ); };

这里添加了属性name,并且给它分配了值"Bill E Goat"。我们并不需要先创建一个空对象,而可以把所有代码直接写在一对括号里。

var bill = { name: "Bill E Goat", sound: function() { console.log( 'bahhh!' ); }};

是不是很美观?访问它的属性和方法就像呼吸一样简单、自然。
bill.name; // "Bill E Goat" bill.sound(); // "bahhh"

如果属性名不是一个合法的标志符,我们还可以这样访问它:
bill['name']; // "Bill E Goat"

注意:我在调用方法时在其后添加了圆括号。现在,我们再重写一下当前的sound方法,并添加一个参数。
bill.sound = function(noise) { console.log(noise); }; bill.sound("brrr!"); // "brrr!" He's cold :)

很好,我们已经传入参数了,并且在方法定义中访问了它。接下来,向对象中增加一个新方法来访问name属性。
bill.sayName = function() { console.log( "Hello " + this.name ); }; bill.sayName(); // "Hello Bill E Goat"

我们可以使用this.propertyName(在本例中即this.name)在方法内访问属性。
bill.sayName; // function

怎么回事?访问sayName方法返回了一个方法定义。现在让我们再深入些。
var sound = bill.sound; sound('moo!'); // "moo!"

现在我们指定了sound方法为一个局部函数,可以调用这个函数并且传递参数。你认为在复制bill的时候会发生什么?(类比下克隆羊Dolly)
var sally = bill; sally.name; // "Bill E Goat",可它的名字是Sallysally.name = "Sally"; sally.name; // "Sally",好些了bill.name; // "Sally",问题又转移到bill身上了

上面的例子中我们新建了一个变量sally,并使它和bill相同,所以bill和sally会在内存中引用了同一个对象。这时候给改变一块它们就会同时发生改变。再看看下面这段代码:
bill.name = "Bill E Goat"; bill.sayName(); // "Hello Bill E Goat"; var sayName = bill.sayName; sayName; // function 目前为止一切顺利sayName(); // "Hello ",为什么这里又不再显示bill的名字了?

bill的name是一个本地实例变量,只对bill可得。当sayName方法被创建为全局变量时,当它碰到this.name声明时,它会在全局查找name的值。唯一的问题在于name还没有被定义。现在让我们在全局定义name,看看会发生什么:
var name = "Bearded Octo"; sayName(); // "Hello Bearded Octo"

这里我们在全局范围内定义了name变量,并且赋予了值"Bearded Octo"。当我们在调用sayHello方法时它会在全局范围内查找name变量,最终会获得值"Bearded Octo"。我们为什么不为这几个对象建立一个共同的“类”呢?
构造函数
构造函数是另一个编写面向对象JavaScript代码的方法,当你需要初始化对象的属性、方法,或者需要创建多个属性、方法各不相同的实例时,它将是你最佳的选择。同样我们先从创建一个空对象开始:
function Game() {};

这个对象包括自己的属性,你甚至可以在创建对象时传入属性,然后再对其进行修改。
var zelda = new Game(); var smb = new Game(); zelda.title = "Legend of Zelda"; smb.title = "Super Mario Brothers"; zelda.title; // "Legend of Zelda" smb.title; // "Super Mario Brothers"

现在这个对象已经有自己的方法了!新创建对象时我们甚至可以传递属性,之后再修改。
function Game(title) { this.title = typeof title !== 'undefined' ? title : ""; }; var zelda = new Game("Legend of Zelda"); zelda.title; // "Legend of Zelda" zelda.title = "Ocarina of Time"; zelda.title; // "Ocarina of Time" var blank = new Game(); blank.title; // ""

也许你没看明白第二行的内容,其实是使用了三元操作来避免单行的if else,它和下面标准的if else语句是一个意思。
if (typeof title !== 'undefined') { this.title = title; } else { this.title = ""; } // Is the same as this.title = typeof title !== 'undefined' ? title : "";

如果title变量在对象被创建时传入,title实例变量将会指定为title的值。如果没有值传入,那么title将会被初始化为默认值""。我们同样可以创建一个方法来访问这个属性:
zelda.loveTitle = function() { console.log( "I love " + this.title ); }; zelda.loveTitle(); // "I love Ocarina of Time"

这样就很整洁了,但是我们还能做得更好。我们可以在Game类中添加一个方法,这样所有Game类的实例将都能使用此方法。
Game.prototype.heartIt = function() { console.log( "I heart " + this.title ); }; zelda.heartIt(); // "I heart Ocarina of Time" smb.heartIt(); // "I heart Super Mario Brothers"

② js是面向对象的编程语言吗

是的,js是基于对象的,连他的function函数都是一种对象。所以是面向对象的!

③ JS编程是什么意思

js就是JavaScript
一、JavaScript是什么?
1、JavaScript是在网站浏览器上运行的编程语言。
主要是向使用HTML和CSS构建的网站添加,并起到实现各种页面动态效果的作用。例如,在网页上展示的轮播图样式和在咨询平台上输入的内容错误后显示的提示信息等这样的效果。另外针对商城网站里面购买商品时,使用购物车和费用估算也需要用到JavaScript。所以即使它不怎么明显,但依然是编码人员经常会用到的一种语言。
2、JavaScript是一种多功能的开发语言。
除了向网页添加动作的用处之外,JavaScript还可以用来实现很多其他的功能。比如它能够开发出各种网站应用程序,如“聊天工具”和“货币图表”等,可以实时进行修改,这也是JavaScript的主要魅力之一。
二、JavaScript的特点有哪些?
1、脚本语言。JavaScript是一种解释型的脚本语言,C、C++等语言先编译后执行,而JavaScript是在程序的运行过程中逐行进行解释。
2、基于对象。JavaScript是一种基于对象的脚本语言,它不仅可以创建对象,也能使用现有的对象。
3、简单。JavaScript语言中采用的是弱类型的变量类型,对使用的数据类型未做出严格的要求,是基于Java基本语句和控制的脚本语言,其设计简单紧凑。
4、动态性。JavaScript是一种采用事件驱动的脚本语言,它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。
5、跨平台性。JavaScript脚本语言不依赖于操作系统,仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用,前提上机器上的浏览器支持JavaScript脚本语言,目前JavaScript已被大多数的浏览器所支持。

④ 怎么学好js

页面要想实现好的互动性Java是必不可少的,特别是在一些网站专题页面对于互动性要求更高,中级和高级web前端工程师js是必须要掌握的,下面为大家详细介绍一下Java。

感觉js学起来“杂而乱”的原因是因为你太“聪明”了,一开始就管的太宽,利害得失也计算的太精细。

要求太完美则心里承受能力下降,很容易出现“障”。此时,你应该“笨”一些,不要考利那么长远,“傻人有傻福”,只要做好今天就够了。

一些不合理的学习方法和心态也让你迷失了自我:如:心浮气躁、眼高手低、好高骛远,这些都会让你在“乱七八糟”的js面前深陷迷雾、不能自拔。

此时,你应该重新定位自己的位置,重新去认识js,放下包袱,方能轻松上阵。把杯子先倒空,才能灌新水......

其实,js是前端的核心。影响越来越深的互联网+会渴求越来越多的js人才,只有经历过真正刻骨铭心的学习经历,才能造就出赢得未来的真正精英。

⑤ JavaScript中如何实现面向对象编程

低版本的js中,可以用原型,原型链来模拟面向对象中,最关键的“类”,

或者ES6中,有class的语法可以用,更贴近其他常见的面向对象的语言,
或者只是单纯的给对象绑定一些方法,这样也可以实现面向对象编程,但是就没什么美感了

⑥ 什么是javascript面向对象编程

面向对象是oop思想,javascript里没有面向对象只有面向过程

热点内容
app什么情况下找不到服务器 发布:2025-05-12 15:46:25 浏览:714
php跳过if 发布:2025-05-12 15:34:29 浏览:467
不定时算法 发布:2025-05-12 15:30:16 浏览:131
c语言延时1ms程序 发布:2025-05-12 15:01:30 浏览:165
动物园灵长类动物配置什么植物 发布:2025-05-12 14:49:59 浏览:734
wifi密码设置什么好 发布:2025-05-12 14:49:17 浏览:148
三位数乘两位数速算法 发布:2025-05-12 13:05:48 浏览:397
暴风影音缓存在哪里 发布:2025-05-12 12:42:03 浏览:541
access数据库exe 发布:2025-05-12 12:39:04 浏览:628
五开的配置是什么 发布:2025-05-12 12:36:37 浏览:365