`
mayi_hetu
  • 浏览: 14533 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

javascript学习笔记(函数、对象、继承)

 
阅读更多

JavaScript 是一段段地执行的。一段代码中的定义式函数语句会优先执行,这似乎有点象静态语言的编译概念。所以,这一特征也被有些人称为:JavaScript 的“预编译”。

 

函数就是对象,只不过比一般的对象多了一个括号“()”操作符,这个操作符用来执行函数的逻辑。

 

call方法举例说明

function WhoAmI() //定义一个函数WhoAmI
{
alert("I'm " + this.name + " of " + typeof(this));
};
WhoAmI(); //此时是this 当前这段代码的全局对象,在浏览器中就是window 对象,其
name 属性为空字符串。输出:I'm of object
var BillGates = {name: "Bill Gates"};
BillGates.WhoAmI = WhoAmI; //将函数WhoAmI 作为BillGates 的方法。
BillGates.WhoAmI(); //此时的this 是BillGates。输出:I'm Bill Gates of obje
ct
var SteveJobs = {name: "Steve Jobs"};
SteveJobs.WhoAmI = WhoAmI; //将函数WhoAmI 作为SteveJobs 的方法。
SteveJobs.WhoAmI(); //此时的this 是SteveJobs。输出:I'm Steve Jobs of o
bject
WhoAmI.call(BillGates); //直接将BillGates 作为this,调用WhoAmI。输出:I'm B
ill Gates of object
WhoAmI.call(SteveJobs); //直接将SteveJobs 作为this,调用WhoAmI。输出:I'
m Steve Jobs of object
BillGates.WhoAmI.call(SteveJobs); //将SteveJobs 作为this,却调用BillGates 的
WhoAmI 方法。输出:I'm Steve Jobs of object
SteveJobs.WhoAmI.call(BillGates); //将BillGates 作为this,却调用SteveJobs 的
WhoAmI 方法。输出:I'm Bill Gates of object
WhoAmI.WhoAmI = WhoAmI; //将WhoAmI 函数设置为自身的方法。
WhoAmI.name = "WhoAmI";
WhoAmI.WhoAmI(); //此时的this 是WhoAmI 函数自己。输出:I'm WhoA
mI of function
({name: "nobody", WhoAmI: WhoAmI}).WhoAmI(); //临时创建一个匿名对象并
设置属性后调用WhoAmI 方法。输出:I'm nobody of object

 

 

在 JavaScript 中,prototype 不但能让对象共享自己财富,而且prototype 还有寻根问祖的
天性,从而使得先辈们的遗产可以代代相传。当从一个对象那里读取属性或调用方法时,如果该对象自身
不存在这样的属性或方法,就会去自己关联的prototype 对象那里寻找;如果prototype 没有,又会去p
rototype 自己关联的前辈prototype 那里寻找,直到找到或追溯过程结束为止。

 

1 function Person(name) //基类构造函数
2 {
3 this.name = name;
4 };
5
6 Person.prototype.SayHello = function() //给基类构造函数的prototype 添加方法
7 {
8 alert("Hello, I'm " + this.name);
9 };
10
11 function Employee(name, salary) //子类构造函数
12 {
13 Person.call(this, name); //调用基类构造函数
14 this.salary = salary;
15 };
16
17 Employee.prototype = new Person(); //建一个基类的对象作为子类原型的原型,
这里很有意思
18
19 Employee.prototype.ShowMeTheMoney = function() //给子类添构造函数的pr
ototype 添加方法
20 {
21 alert(this.name + " $" + this.salary);
22 };
23
24 var BillGates = new Person("Bill Gates"); //创建基类Person 的BillGates 对象
25 var SteveJobs = new Employee("Steve Jobs", 1234); //创建子类Employee
的SteveJobs 对象
26
27 BillGates.SayHello(); //通过对象直接调用到prototype 的方法
21
28 SteveJobs.SayHello(); //通过子类对象直接调用基类prototype 的方法,关注!
29 SteveJobs.ShowMeTheMoney(); //通过子类对象直接调用子类prototype 的方法
30
31 alert(BillGates.SayHello == SteveJobs.SayHello); //显示:true,表明prototyp
e 的方法是共享的

分享到:
评论

相关推荐

    javascript学习笔记.docx

    f) 继承:只是在查询一个属性时自动发生,而不会在写属性时发生,就是说单写一个父类的属性时,JavaScript环境会为对象本身创建一个同名的属性,从此该属性就覆盖了父类中的属性。 12) 创建一个数组可用 new Array()...

    《javascript设计模式》学习笔记二:Javascript面向对象程序设计继承用法分析

    本文实例讲述了Javascript面向对象程序设计继承用法。分享给大家供大家参考,具体如下: 1.关于继承: 百度百科对继承的解释是:继承是...所谓的构造函数继承,就是通过创建一个新对象,调用父类构造函数实现的一种继承

    JavaScript-学习笔记.docx

    自己学习笔记。视频:腾讯课堂:渡一教育 内容大纲: 预编译: 函数 闭包问题 对象 原型、原型链、call、apply 继承模式 对象克隆 数组 类数组 数组去重 自定义type方法(类似于typeof) try-catch es5.0严格模式 ...

    Javascript学习笔记之函数篇(四):arguments 对象

    每一个 Javascript 函数都能在自己作用域内访问一个特殊的变量 – arguments。这个变量含有一个传递给函数的所有参数的列表。 arguments 对象不是一个数组。尽管在语法上它跟数组有相同的地方,例如它拥有 length ...

    JavaScript函数、闭包、原型、面向对象学习笔记

    给大家分享了一篇关于JavaScript函数、闭包、原型、面向对象的知识点学习笔记内容,有兴趣的朋友参考下。

    Javascript 读书笔记索引贴

    基础篇 Javascript学习笔记1 数据类型 Javascript学习笔记2 函数 Javascript学习笔记3 作用域 Javascript学习笔记4 Eval函数 Javascript学习笔记5 类和对象 Javascript学习笔记6 prototype的提出 Javascript学习...

    JavaScript高级资料JavaScript代码 素材 笔记 作业资料.zip

    JavaScript高级资料JavaScript代码 素材 笔记 作业资料,学习资料 01-创建类和对象.html 02-类中添加方法(1).html 03-类的继承(1).html 04-super关键字调用父类普通函数(1).html 05-子类继承父类方法同时扩展自己...

    ExtJS4中文教程2 开发笔记 chm

    Javascript 面向对象之非构造函数的继承 JavaScript对象与继承教程之内置对象(下) JavaScript对象及继承教程(上) javascript正则表达式(一) javascript正则表达式(二) JavaScript的10种跨域共享方法 JavaScript...

    Ruffy javascript 学习笔记

    2,javascript中,为了实现继承,必须将子类构造函数的prototype设置为一个父类的对象实例. 3,css的方块套方块模型: 最外是margin 是用来设置一个元素所占的空间的边缘到相邻元素的距离 边框:border 用来设定一个...

    JavaScript继承学习笔记【新手必看】

    JavaScript作为一个面向对象语言(JS是基于对象的),可以实现继承是必不可少的,但是由于本身并没有类的概念,所以不会像真正的面向对象编程语言通过类实现继承,但可以通过其他方法实现继承。实现继承的方法很多,...

    Javascript学习笔记9 prototype封装继承

    好,那就让我们一步步打造,首先让我们来看下继承原本的写法: 代码如下: [removed] var Person = function(name, age) { this.name = name; this.age = age; } Person.prototype.SayHello = function () { alert&#...

    Extjs学习笔记之八 继承和事件基础

    整个Extjs框架都是以一种面向对象的方式开发的,所以理解Javascript中的继承也很重要。我前面的一篇文章 补点基础:Javascript中的类和闭包 也是为这篇做准备。另外,博客园内还有一个写的很好的系列 JavaScript继承...

    作为前端,你需要懂得javascript实现继承的方法

    现在我们可以利用ES6的extends方法实现继承,如果想了解更多有关ES6实现的继承请查看《ES6学习笔记(二):教你玩转类的继承和类的对象》,在这里不再做更多的介绍。 文章目录1. call()2. 借用构造函数继承父类型...

    javascript原型链学习记录之继承实现方式分析

    本文实例讲述了javascript原型链学习记录之继承实现方式。分享给大家供大家参考,具体如下: 在慕课网学习继承的笔记: 继承的几种方式: ① 使用构造函数实现继承 function Parent(){ this.name = 'parent'; } ...

    JavaScript高级整理

    谷粒学院学习笔记,内容包括 原型与原型链、执行上下文、执行上下文栈、变量提升、函数提升、作用域、作用域链、闭包、对象的多种创建模式、对象的继承模式、JavaScript事件循环机制等。

    javascript-learning-road:js学习笔记

    类笔记 类继承 利用super()来调用父类的构造函数。 1.super()必须在子类此之前调用。 2.类里共有的属性和方法一定要加这个。 3.constructer里面的这个指向实例对象,方法里的this指向这个方法的调用者。 新执行...

    javascript中类的定义及其方式(《javascript高级程序设计》学习笔记)

    关于javascript中类的继承可以参考阮一峰的Blog《Javascript继承机制的设计思想》,说的很透。 一、在javascript中实例化遇到的问题: 下面用《javascript高级程序设计》中的例子来做说明,假如现在定义了一个car的...

    JavaScript 继承详解及示例代码

    有些知识当时实在看不懂的话,可以先暂且放下,留在以后再看也许就能看懂了...链接: [学习笔记] 小角度看JS原型链 从原文中小摘几句 构造函数通过 prototype 属性访问原型对象 实例对象通过 [[prototype]] 内部属性

    30s-code:30scode学习笔记

    30s代码学习笔记 大批 orderWith:根据所提供的顺序排列,返回按属性排序的已排序的对象数组 组合:组合两个对象的模型,使用指定的键来匹配对象 hasDuplicates:检查平面副本中是否有重复的值 pullBy:根据给定的...

Global site tag (gtag.js) - Google Analytics