JavaScript-StepPitGuide
  • 封面
  • 前言
  • 基础知识
    • 基础知识
      • 变量声明
      • 变量类型和计算
      • 作用域
      • 基本数据类型
        • Undefined
        • Null
        • Boolean
        • Number
        • String
        • Symbol
      • 类型转换
    • 引用类型
      • Object类型
      • Array类型
        • 检测数组
        • 转换方法
        • 栈方法
        • 队列方法
        • 重排序方法
        • 操作方法
        • 位置方法
        • 迭代方法
        • 归并方法
      • Date类型
      • RexExp类型
      • Function类型
      • Set类型(ES6)
      • Map类型(ES6)
    • BOM
      • window对象
      • location对象
      • navigator对象
      • screen对象
      • history对象
    • DOM
      • DOM节点操作
      • DOM结构操作
    • 事件
      • 事件流
      • 事件注册与触发
      • 事件对象
      • 事件分类
    • 异步
      • Ajax
      • Promise
    • 正则表达式
    • 面向对象程序设计
      • 构造函数
      • 原型链
      • 继承
      • New
      • Object.create
    • 函数表达式与函数式编程
      • 递归
      • 闭包
      • this
      • 箭头函数
      • 高阶函数
      • 由函数构建函数
      • 纯度、不变性和更改政策
      • 基于流的编程
      • 无类编程
      • 函数基本应用
    • 语法规则
      • ESlint
  • 进阶知识
    • 算法应用
      • 基本排序算法
        • 冒泡排序
        • 选择排序
        • 插入排序
        • 希尔排序
        • 归并排序
        • 快速排序
    • 模块化
      • AMD
      • CommonJS
      • ES6模块化
    • 应用
      • Socket.io库
      • async+await异步调用
      • axios
    • 设计模式
    • 性能优化
    • 工具
      • 时间操作
    • 异常监控
    • 安全🔐
      • XSS
      • CSRF
    • 跨域
      • 跨域
      • 跨域方法
        • Hash
        • JSONP
        • CORS
        • XDomainRequest
由 GitBook 提供支持
在本页
  • 理解对象
  • 原型规则和示例
  • instanceof

这有帮助吗?

  1. 基础知识

面向对象程序设计

理解对象

  • ECMAScript对于对象的定义:无序属性的集合,其属性可以包含基本值、对象或者函数

  • JavaScript每个对象都是基于一个引用类型创建的。

  • 引用类型可以是原生类型也可以是自己定义的类型。

原型规则和示例

  • 5条原型规则

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

第1条

  • 所有的引用类型(数组、对象、函数),都具有对象特质、即可自由扩展属性(除了“NULL”以外)

var obj = {}; obj.a = 100;
var arr = []; arr.a = 100;
function fn(){
  fn.a=100;
}

第2条

  • 所有的引用类型(数组、对象、函数),都有一个__proto__(隐式原型)属性,属性值是一个普通的对象

console.log(obj.__proto__);
console.log(arr.__proto__);
console.log(fn.__proto__);

第3条

  • prototype解释为JavaScript开发函式库及框架

  • 所有的函数,都有一个prototype(显示原型)属性,属性值也是一个普通对象。

console.log(fn.prototype);

第4条

  • 所有引用类型(数组、对象、函数),__proto__属性值指向它的构造函数的prototype属性值

console.log(obj.__proto__ === Object.prototype);

第5条

  • 当试图得到一个对象的某个属性时,如果这个对象本身没有这个属性,那么会去它的__proto__(即它的构造函数prototype)中寻找

//构造函数
function Foo(name,age){
   this.name = name;
}
Foo.prototype.alertName = function () {
   alert(this.name);
}
//创建示例
var f = new Foo('zhangsan')
f.printName = function () {
  console.log(this.name);
}
//测试
f.printName();
f.alertName();

循环对象自身属性

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

instanceof

  • 用于判断引用类型属于哪个构造函数的方法

  • f instanceof Foo 的判断逻辑是:

  • f的__proto__一层一层往上走,是否能对应到Foo.prototype

  • 再试着判断f instanceof Object

上一页正则表达式下一页构造函数

最后更新于3年前

这有帮助吗?