## 什么是原型
原型与原型链是学习JavaScript这门语言不能不理解的两个重要概念,为什么?因为JavaScript是一门基于原型的语言。
怎么理解“JavaScript是一门基于原型的语言”?在软件设计模式中,有一种模式叫做原型模式,JavaScript正是利用这种模式而被创建出来。先来了解下原型模式的概念:原型模式是用于创建重复的对象,同时又能保证性能。这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式。这种模式是实现了一个原型接口,该接口用于创建当前对象的克隆。原型模式的目的是用原型实例指定创建对象的种类,并且通过拷贝这些原型创建新的对象。也就是说利用已有的一个原型对象,可以快速地生成和原型对象一样的新对象实例。
原型:
原型到底是什么?原型是一个可以被复制(或者叫克隆)的一个类,通过复制原型可以创建一个一模一样的新对象。通俗的说,原型就是一个模板,在设计语言中更准确的说是一个对象模板。
## 对象原型
当调用对象的属性或者方法的时候,先去找对象本身的属性/方法,如果对象没有该属性或方法,此时去调用原型中的属性/方法.如果对象本身没有该属性/方法,原型中也没有该属性/方法,那么会报错.
对象的__proto__等于 构造函数的 Person.prototype
__proto__属性是非标准的,生产环境不要使用.
```
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype.show = function () {
console.log(this.name);
}
var p1 = new Person('jack', 20);
console.log(p1.__proto__ === Person.prototype); //true __proto__就是对构造函数的prototype的引用
```
在原型对象中有一个属性constructor,这个属性就是构造函数.constructor的作用就是记录了创建该对象的构造函数.我们想知道这个对象是什么类型,是什么构造函数创建的,通过它就可以知道对象的构造函数.
```
ƒ Person(name, age) {
this.name = name;
this.age = age;
}
```
- 函数
- arguments
- 作用域
- 作用域链
- 预解析
- 对象
- 简单类型和复杂类型
- 内置对象
- Web API
- DOM
- 获取页面元素
- 注册事件及应用
- 点击切换图片
- 非表单元素的属性
- 取消a标签的默认行为
- 美女轮播图
- innerText和innerHTML
- 表单元素的属性
- 下拉框选中项
- 全选反选
- 自定义属性
- mouseenter和mouseover区别
- 样式操作及应用
- 操作样式
- 链式操作原理
- 显示隐藏二维码
- 高亮正在输入的文本框
- 隔行变色
- tab栏切换
- 常见dom操作
- 节点介绍及应用
- 模拟DOM
- 兄弟节点
- 获取子节点
- 菜单
- 父子节点
- 动态创建元素及应用
- 动态创建元素
- 动态创建列表
- 动态创建表格
- 动态创建元素性能对比
- 常用元素操作方法
- 事件详解
- 注册事件的几种方式
- addEventListener
- 移除事件
- 事件的三个阶段
- 事件委托
- 事件对象1
- 事件对象2
- 事件对象3
- 图片跟着鼠标移动
- 获取鼠标在盒子中的坐标
- 获取页面滚动的距离
- 取消默认行为的执行
- 阻止事件冒泡
- input只能输入数字
- BOM
- 概述
- 对话框
- JS加载详解
- setTimeout
- setInterval
- 简单动画
- location
- history
- UserAgent
- offset,client,scroll
- offset系列属性
- client系列属性
- scroll系列属性
- 拖拽案例
- 弹出登录窗口
- 动画函数封装
- 高级
- 浏览器的组成
- 面向对象
- 概述
- 面向对象开发过程
- 创建对象
- new的时候发生了什么
- 静态成员和实例成员
- 构造函数的原型
- 对象的原型
- 三者关系
- 原型链
- 属性查找规则
- 注意点
- 扩展内置对象
- 继承
- 原型继承
- call
- 借用构造函数
- 组合继承
- 函数进阶
- 函数声明和函数表达式
- 函数也是对象
- 函数调用方式和this指向
- call,bind,apply改变函数中的this
- AJAX
- 基础知识
- 原生AJAX
- 同步与异步
- JS异步原理
- Node
- 模块化
- 概述
- 模块成员导出详解
- ES6
- 解构赋值
- 字符串扩展
- 函数拓展
- 箭头函数
- 类与继承
- export default 和export
- Promise
- 回调函数
- 回调地狱
- promise基本概念
- Promosew实例只要被创建就立即执行里面的异步方法
- 使用then指定成功和失败的回调
- promise正确使用方式
- 捕获异常的两种方式
- NPM和NRM
- WebPack
- 概述
- plugin配置和使用
- loader配置和使用
- webpack和vue结合
- webpack中导入和script标签
- vue中结合render函数渲染指定组件到容器中
- 总结
- vue-router
- 跨域
- json
- jQuery
- 概述
- 注意
- dom对象和jquery对象互转
- 选择器
- 基础选择器
- 绑定事件
- 触发器
- 事件对象
- 事件冒泡
- 取消事件冒泡
- HTML5新增API
- 检测网络状态
- 全屏
- 文件读取
- 地理定位
- 百度地图名片
- 拖放
- 本地存储
- 应用缓存
- 多媒体播放器布局
