js中类的扩充及面向对象的技术解析
类的扩充
ps,纠正之前的一个错误,之前直接重新提交函数的,而重新提交函数表明这是讲之前的函数清空,重新引用,注意:这样的话已经不存在引用关系,所以这样对于类的修改,不会影响其原先继承的修改类的扩充,是动态添加的,这样原先的继承关系依旧存在,此时两者之间依旧存在继承关系,如果发生修改,则继承依旧继续
好吧。(∩_∩)现在更改错误了,毕竟知识是需要不断更改错误才行的
下面是对编写的类进行扩充
对于类进行添加
继续重复,额,这算是一个自己的小的知识错误吧,使用赋值进行添加,而不是修改函数进行添加,毕竟我是直接在浏览器里写的(写长的js的时候是直接在浏览器的js代码草稿纸上面写的)
Complex.prototype.conj = function() { return new Complex(this.r, -this.i); };
下面是一个调用函数f,传入一个迭代数,根据迭代数,来调用函数f
Number.prototype.times = function(f, context) { // 传入两个形参,一个是调用的函数f,另外一个是需要循环调用的内容,迭代数为对象 var n = Number(this); // 将其使用这个方法的对象进行强制类型转换为数字,如果非数字,将会转换为NaN for(var i = 0; i < n; i++) f.call(context,i); // 根据迭代数来进行输出 };
先查看一下如果创建对象将会继承的类
好啦哦~
创建完成,接着尝试使用一下这个刚刚创建方法
这样就完成了一次对于类的添加,因为是动态的,所以直接继承
如果不存在该对象的兼容写法
String.prototype.trim = String.prototype.trim || function() { if (!this) return this; // 类型转换中空字符串为false,否则为true return this.replace(/^\s+|\s+$/g, ''); }
这是一种兼容的写法,如果浏览器不存在该属性,则直接创建一个新的属性,其中||包含判断
这算是一种兼容了吧,但愿以后都能兼容规范,这样就不用再折腾兼容的问题,可以开心的玩耍了~
类和类型
instanceof 运算符
这个和in有点类似,不过这个是继承的,其用法参考in即可
需要注意的是框架页面的问题,因为框架页面中每个都是独立的
貌似明白了学校坑人的vpn使用的就是框架页面,很坑人
a; function a() var b = new a; undefined b; Object { } b instanceof a; true
过~
constructor属性
该属性前页讨论过,这个属性是继承只某个类的属性
通过查看constructor即可知道该对象是继承自某个函数的
同样的,一个多个字页面的框架这个属性也是很坑的,和上一个类似,也是同样这样操作会报错,是在多个子页面的框架页面中,因为是相互独立的。或者有多个副本的时候,也同样会出问题
name属性
函数的名字
arguments
传入的参数
caller
返回其调用栈
递归很好用
function myFunc() { if (myFunc.caller == null) { return ("该函数在全局作用域内被调用!"); } else return ("调用我的是函数是" + myFunc.caller); }
function test(){ return myFunc(); }
test(); "调用我的是函数是function test(){ return myFunc(); }"
对返回直接是调用栈的源代码
ps不是一个普遍的方法,是一个特性,请尽量不要在生产环境中使用它~
鸭式辩型
好吧,(∩_∩)
像鸭子一样走路,游泳并且嘎嘎叫的鸟就是鸭子
所以呢,不要关注对象的类是什么,关注对象能做什么,
关注能做的内容即可,没有必要非要关注从哪继承
js中面向对象的技术
集合类
集合是一种数据结构,用来表示非重复值的无序组合。集合方法为添加值,检测值是否在集合中。
js的对象是属性名和与之对应值的基本集合
下面是实现一个set类,实现从js的值到唯一的字符串之间的映射关系,将字符串用作属性名
用到的方法
Object.prototype.hasOwnProperty()
hasOwnProperty() 方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性
链式调用
function test1() { this.test2 = function() { return 333, this; }; this.test3 = function() { return 444, this; } };
var a = new test1(); undefined a; Object { test2: test2() , test3: test3() }
a.test2(); Object { test2: test2() , test3: test3() } a.test2().test3(); Object { test2: test2() , test3: test3() }
好啦,这个是链式调用
应该注意的是this的用法
全部代码
/* * * set.js文件,实现一个字符串到集合之间的映射,然后将字符串用作属性名 * */ function Set() { // 这是一个构造函数 this.values = {}; // 集合的数据保存在对象的属性里 this.n = 0; // 集合中值的个数 this.add.apply(this, arguments); // 把所有的参数都添加进这个集合中 add为自定义的方法 } // 将每个参数都添加到集合中 // 实现 add 方法 Set.prototype.add = function() { for(var i = 0; i < arguments.length; i++) { // 进行遍历操作,遍历每个参数 var val = arguments[i]; // 这是待添加到集合中的值 var str = Set._v2s(val); // 自定义方法,将遍历到的值转换为字符串 if (!this.values.hasOwnProperty(str)) { // 如果不在集合中 this.values[str] = val; // 将字符串和值对应起来 this.n++; // 集合中的值计数器加1 }; }; return this; // 支持链式调用 }; // 从集合中删除元素,这些元素由参数制定 Set.prototype.remove = function () { for(var i = 0; i < arguments.length; i++) { // 遍历每个参数 var str = Set._v2s(arguments[i]); // 将字符串和值对应起来 if (this.values.hasOwnProperty(str)) { // 如果在集合中 delete this.values[str]; // 则删除这个属性 this.n--; // 将长度减去一个 } } return this; // 让这个函数支持链式调用 } // 如果集合包含这个值,则返回true,否则,返回false Set.prototype.contains = function (value) { return this.values.hasOwnProperty(Set._v2s(value)); }; // 返回集合的大小 Set.prototype.size = function () { return this.n; }; // 遍历集合中的所有元素,在指定的上下文中调用f Set.prototype.foreach = function (f, context) { for(var s in this.values) // 遍历集合中的所有的字符串。使用的是for in 语法 if (this.values.hasOwnProperty(s)) // 将继承的属性忽视,即prototype的属性全部忽视 f.call(context, this.values[s]); // 以context的对象的调用方法f并传入参数values的值 }; // 这是一个内部函数,用以将任意的js的值和唯一的字符串对应起来 Set._v2s = function (val) { switch (val) { case undefined: return 'u'; // 说明这是特殊的原始值 case null: return 'n'; // 值为null的情况 case true: return 't'; // 正确的值 case false: return 'f'; // 错误的值 default: switch (typeof val) { // 所有的条件都不匹配的情况下,执行另外一个选择,分开写的原因是因为让程序具有分层作用 case 'number': return '#' + val; // 如果为数字,则将所有的数字前加上# case 'string': return '"' + val; // 字符串全部带上"前缀 default: return '@' + objectId(); // 前面加上@并调用一个私有方法 } } // 对于任意对象来说,都会返回一个字符串 // 针对不同对象,这个函数会返回不同的字符串 // 对于同一个对象的多次调用,总是返回相同的字符串 function objectId(o) { var prop = "|**objectid**|"; // 私有属性,用来存放id,其中内容仅仅为注释 if (!o.hasOwnProperty(prop)) // 如果传入的对象没有id,则进行id赋值 o[prop] = Set.next++; // 进行赋值,并完成一次自加,即先赋值,后自加 return o[prop]; // 仅仅是返回该id } }; Set._v2s.next = 100; //设置初始值为100
相关推荐:
以上就是js中类的扩充及面向对象的技术解析的详细内容,更多请关注其它相关文章!
上一篇: 详细介绍C#中的常用方法
下一篇: php编程的安全防范知识
推荐阅读
-
Python面向对象程序设计中类的定义、实例化、封装及私有变量/方法详解
-
js继承 Base类的源码解析_js面向对象
-
闭包的原理与经典应用场景,访问器属性,类与对象的创建与成员引用,数组与对象的解构过程与经典案例,JS引入到浏览器中的的方法及获取DOM元素的两个API
-
闭包的原理与经典应用场景,访问器属性,类与对象的创建与成员引用,数组与对象的解构过程与经典案例,JS引入到浏览器中的的方法及获取DOM元素的两个API
-
javascript中类的定义及其方式(《javascript高级程序设计》学习笔记)_js面向对象
-
javascript中类的定义及其方式(《javascript高级程序设计》学习笔记)_js面向对象
-
Javascript 中的类和闭包_js面向对象
-
php面向对象类中的$this,static,final,const,self及双冒号 : 这几个关键字使用方法
-
闭包及访问量属性和类与对象解构赋值以及js中对html中的dom操作(时间有点紧,没全理解透,需回头整理)
-
js中类的扩充及面向对象的技术解析