03-JavaScrpit-面向对象程序设计

优质
小牛编辑
130浏览
2023-12-01
  • ECMAScript对于对象的定义:无序属性的集合,其属性可以包含基本值、对象或者函数
  • JavaScript每个对象都是基于一个引用类型创建的。
  • 引用类型可以是原生类型也可以是自己定义的类型。

原型规则和示例

  • 5条原型规则
  • 原型规则是学习原型链的基础

第1条

  • 所有的引用类型(数组、对象、函数),都具有对象特质、即可自由扩展属性(除了“NULL”以外)
  1. var obj = {}; obj.a = 100;
  2. var arr = []; arr.a = 100;
  3. function fn(){
  4. fn.a=100;
  5. }

第2条

  • 所有的引用类型(数组、对象、函数),都有一个__proto__(隐式原型)属性,属性值是一个普通的对象
  1. console.log(obj.__proto__);
  2. console.log(arr.__proto__);
  3. console.log(fn.__proto__);

第3条

  • prototype解释为JavaScript开发函式库及框架
  • 所有的函数,都有一个prototype(显示原型)属性,属性值也是一个普通对象。
  1. console.log(fn.prototype);

第4条

  • 所有引用类型(数组、对象、函数),__proto__属性值指向它的构造函数的prototype属性值
  1. console.log(obj.__proto__ === Object.prototype);

第5条

  • 当试图得到一个对象的某个属性时,如果这个对象本身没有这个属性,那幺会去它的__proto__(即它的构造函数prototype)中寻找
  1. //构造函数
  2. function Foo(name,age){
  3. this.name = name;
  4. }
  5. Foo.prototype.alertName = function () {
  6. alert(this.name);
  7. }
  8. //创建示例
  9. var f = new Foo('zhangsan')
  10. f.printName = function () {
  11. console.log(this.name);
  12. }
  13. //测试
  14. f.printName();
  15. f.alertName();

循环对象自身属性

  1. var item;
  2. for (item in f) {
  3. //高级浏览器已经在for in 中屏蔽了来自原型的属性
  4. //但是这里建议大家还是加上这个判断,保证程序的健壮性
  5. if(f.hasOwnProperty(item)) {
  6. console.log(item);
  7. }
  8. }

instanceof

  • 用于判断引用类型属于哪个构造函数的方法
  • f instanceof Foo 的判断逻辑是:
  • f__proto__一层一层往上走,是否能对应到Foo.prototype
  • 再试着判断f instanceof Object