原型
描述
- 所有函数(Function类型)都具有的属性
- 在函数进行定义时,就包含prototype属性
- prototype属性的默认值为一个空对象 {}
获取原型
-
第一种
- 构造函数的prototype属性
-
第二种
- Object对象提供的getPrototypeOf()方法
function fun() {
console.log( '啊哈哈' );
}
/* 所有函数都具有prototype属性,可以直接调用 */
console.log( fun.prototype );// 显示 fun {}
/*
Function类型包含 构造函数
* 所有引用类型都可以使用 构造函数方式定义 - 所有引用类型都是构造函数
* 构造函数也可以用来定义对象(Object类型) - Object也可以调用prototype属性
*/
/* 引用类型调用prototype属性 */
console.log( String.prototype );// 显示 [String: '']
/* Object调用prototype属性 */
console.log( Object.prototype );// 显示 {}
/*
获取原型
* 可以通过以下两种方法获取指定目标的原型
* 第一种
* 构造函数的prototype属性
* 第二种
* Object对象提供的getPrototypeOf()方法
*/
/* 定义一个函数 */
function fn() {
console.log( '呕呀呀' );
}
/* 通过prototype属性获取 */
console.log( fn.prototype );// 显示 fn {}
/* 通过getPrototypeOf()方法获取 */
console.log( Object.getPrototypeOf( fn ) );// 显示 [Function]
原型新增属性或方法
- 获取的原型会得到一个空对象
- 是对象就有属性或方法
- 也可以新增属性或方法
新增方式
-
第一种方式
- 构造函数.prototype.属性名(方法名) = 属性值(方法体)
/* 定义一个函数 */
function fun() {
console.log( 100 );
}
/* 第一种方式 */
/* 获取原型 */
console.log( fun.prototype );// 显示 fun {}
/* 为原型添加属性或方法 */
fun.prototype.name = '唐三';
/* 才重新获取原型 */
console.log( fun.prototype );// 显示 fun { name: '唐三' }
-
第二种方式
- Object.defineProperty( 获取原型,属性名(方法名),{ 属性描述符 } )
/* 定义一个函数 */
function fun() {
console.log( 100 );
}
/* 第二种方式 */
/* 获取原型 */
console.log( fun.prototype );// 显示 fun { name: '唐三' }
/* 为原型添加属性或方法 */
Object.defineProperty( fun.prototype, 'nian', {
/* 设置属性值或方法体 */
value : 20,
/*
设置是否可枚举
* 用于打印对象时可以正常显示新增的属性
* 不设置可枚举时将无法显示新增属性,只显示原有属性
* 显示 fun { name: '唐三' }
*/
enumerable : true
} );
/* 才重新获取原型 */
console.log( fun.prototype );// 显示 fun { name: '唐三', nian: 20 }
自有属性和原型属性
自有属性
- 构造函数(对象)本身自带或添加的属性
原型属性
- 从原型中获得属性
/* 定义一个构造函数 */
function Fun() {
/* 设置自有属性和方法 */
this.name = '唐三';
this.menpai = function () {
console.log( '唐门' );
}
}
/* 获取原型 */
console.log( Fun.prototype );//Fun {}
/* 为原型添加新属性 - 原型属性 */
Fun.prototype.nian = 20;
/* 在获取原型 */
console.log( Fun.prototype );//Fun { nian: 20 }
/*
通过构造函数Fun创建对象
* 该对象具有构造函数Fun的自有属性
* 该对象也具有构造函数Fun的原型属性
*/
/* 创建对象 */
var fn = new Fun();
/* 调用自有属性 */
console.log( fn.name );// 显示 唐三
/* 调用原型属性 */
console.log( fn.nian );// 显示 20
/* 使用相同的构造函数在创建一个对象 */
var fu = new Fun();
/* 新对象对自有属性进行修改 */
fu.name = '融念冰';
/* 调用修改的自有属性 */
console.log( fu.name );// 显示 融念冰
/* 两个对象之间不会有影响 */
console.log( fn.name );// 显示 唐三
/* 修改原型属性 */
Fun.prototype.nian = 25;
/* 以构造函数Fun创建的对象都会被修改 */
console.log( fn.nian );// 显示 25
console.log( fu.nian );// 显示 25
重写属性
- 表示在自有属性和原型属性同名时,自有属性会覆盖原型属性
/* 定义一个构造函数 */
function Fun() {
/* 自有属性 */
this.name = '唐三';
}
/* 获取原型并添加原型属性 */
Fun.prototype.name = '融念冰';
/* 创建一个对象 */
var fn = new Fun();
/* 调用属性 */
console.log( fn.name );// 显示 唐三(自身属性)
删除属性
- 通过delete关键字来进行删除
- 如果进行删除的目标对象同时具有自有属性和原型属性,会先删除自有属性
/* 定义一个构造函数 */
function Fun() {
/* 自有属性 */
this.name = '唐三';
}
/* 获取原型并添加原型属性 */
Fun.prototype.name = '融念冰';
/* 创建一个对象 */
var fn = new Fun();
/* 调用属性 */
console.log( fn.name );// 显示 唐三(自身属性)
/*
删除属性
* 通过delete关键字来进行删除
* 如果进行删除的目标对象同时具有自有属性和原型属性,会先删除自有属性
*/
/* 删除目标对象的指定属性 */
delete fn.name;// 优先删除自有属性
/* 在调用已删除的属性 */
console.log( fn.name );// 显示 融念冰(原型属性)
检测属性
- 表示检测目标对象中,是否存在指定属性
Object.hasOwnProperty()方法
-
Object.hasOwnProperty( 指定属性名称 )方法
- 用于判断当前指定属性是否为自有属性
- true - 表示存在
- false - 表示不存在
/* 定义一个构造函数 */
function Fun() {
/* 自有属性 */
this.name = '唐三';
}
/* 原型属性 */
Fun.prototype.name = '融念冰';
/* 创建对象 */
var fn = new Fun();
/* Object.hasOwnProperty()方法 */
console.log( fn.hasOwnProperty( 'name') );// 显示 true
in 关键字
-
in 关键字 - (属性名 in 对象名)
- 用于判断对象中是否存在指定属性(自有属性或原型属性)
- true - 表示存在
- false - 表示不存在
/* 定义一个构造函数 */
function Fun() {
/* 自有属性 */
this.name = '唐三';
}
/* 原型属性 */
Fun.prototype.name = '融念冰';
/* 创建对象 */
var fn = new Fun();
/* in 关键字 */
console.log( 'name' in fn );// 显示 true
显示原型和隐式原型
显示原型
- 所有函数的原型(prototype)都可以称为是显示原型
隐式原型
- 所有对象的原型(__proto__)都可以称为是隐式原型
/* 定义一个构造函数 */
function Fun() {
/* 自有属性 */
this.name = '唐三';
}
/* 原型属性 */
Fun.prototype.nian = 20;
/* 创建对象 */
var fn = new Fun();
/* 调用自有属性 */
console.log( fn.name );// 显示 唐三
/* 调用原型属性 */
console.log( fn.nian );// 显示 20
/* 对象调用函数的原型 */
console.log( fn.prototype );// 显示 undefined 对象会将prototype,当做自身的属性进行调用
/* 对象调用对象的原型 */
console.log( fn.__proto__ );// 显示 Fun { nian: 20 }
isPrototypeOf()方法
-
表示用于判断一个指定对象是否为另一个目标对象的原型
- true - 表示 是
- false - 表示 不是
/* 定义一个对象 */
var obj = {
name : '唐三'
}
/* 定义一个构造函数 */
function Fun() {}
/* 将指定对象赋值给构造函数Fun的原型 */
Fun.prototype = obj;
/* 创建对象 */
var fn = new Fun();
/* 判断obj对象是否为fn对象的原型 */
console.log( obj.isPrototypeOf( fn) );// 显示 true
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。