js 对象细节
原型和原型链
在对象自身身上找不到指定属性时,就会到这个对象的原型__proto__上找,原型也是指向一个对象,在这个对象上还找不到对应属性,则继续到原型上来找...以上过程形成原型链。
访问对象的原型:obj.__proto__ 或者可以调用Object.getPrototypeOf(obj),返回的值也是obj.__proto__;
obj.__proto__ 的值,在对象构造的时候,默认等于 obj.constructor.prototype ,可以理解为默认情况下:obj.__proto__ = obj.constructor.prototype = xx。
所以在对象被构造出来后,再去修改obj.constructor.prototype是无效的,对于已经生成的对象,修改其原型,只能通过修改obj.__proto__来实现。
空对象{} 的构造函数为 Object
直接在空对象的原型上添加或修改属性,会作用到js的所有对象中,因为所有的js对象的原型链终点都是Object.prototype所指向的对象:
Object.getPrototypeOf({}).x=13;
console.log([].x) //
对象属性
以下方式添加的属性都是添加到对象身上。
var obj;
obj = {
x:123,
method(){
return 123
}
};
obj.y = 99; // function Person(){
// this.a = 123;
// }
//
// obj = new Person();
console.log(obj)
包括Object.assign(target,src1,src2),仅仅把src对象身上的属性添加到target身上而已。可以使用assign来实现对象浅拷贝。
对象的遍历:http://es6.ruanyifeng.com/#docs/object#属性的可枚举性和遍历
获取不存在的属性,会从原型上获取,但是创建和原型上名字相同的属性时,对象身上以及原型上会同时存在同名的属性,两者不会冲突,取值的时候会优先从对象身上获取
var a = {
name:"ben"
};
var b = {};
b.__proto__ = a;
console.log(b.name); // ben
b.name = 'kity';
console.log(b.name); // kity
console.log(a.name); // ben
对于 ES6 的class ,方法直接定义在原型上
class Point {
toString() {
// ...
}
}
// 等同于
Point.prototype = {
toString() {},
};
typeof Point // "function"
克隆
首先复制原型,后复制对象身上的属性。
function clone(origin) {
let originProto = Object.getPrototypeOf(origin);
return Object.assign(Object.create(originProto), origin);
}
ps:
Object.create(target) 的作用实际上以target为原型(__proto__),创建并返回一个空对象。
继承
ES5中需要手动修改原型链来实现继承
ES6中使用extend语法实现继承,本质是首先生成一个父类的对象(在子类的构造函数中必须显式或隐式调用了父类的构造函数),然后以这个父类的对象为原型(__proto__),创建子类对象。
B继承A,创建B对象,创建的过程是这样的:创建A对象Aobj,Aobj是一个空的对象,接着A的原型Apro,Apro也是空的对象,然后将class A中的方法定义到Apro对象上,接着让Aobj.__proto__ = Apro。这是创建单个class实例的过程。接着创建Bobj,是一个空的对象,然后让Bobj.__proto__ = Aobj,接着让class B上的方法,添加到Aobj对象上。

通过class new出来的对象的constructor指向class,在ES5也是类似,通过函数new出来的对象的constructor指向函数
Object.freeze 和 const
const代表属性的值不能发生变化,如果值是对象,则对象可变,但被修饰为const的对象引用不能发生变化
freeze:浅冻结,被冻结的对象,不能添加、删除、修改属性,但如果属性是对象,则对象可变,在严格模式下,违反freeze的规则会抛出异常,普通模式下则不会有任何变化(静默模式)
js 对象细节的更多相关文章
- 深入理解JS 执行细节
javascript从定义到执行,JS引擎在实现层做了很多初始化工作,因此在学习JS引擎工作机制之前,我们需要引入几个相关的概念:执行环境栈.全局对象.执行环境.变量对象.活动对象.作用域和作用域链等 ...
- DOM对象本身也是一个js对象,所以严格来说,并不是操作这个对象慢,而是说操作了这个对象后,会触发一些浏览器行为(转)
一直都听说DOM很慢,要尽量少的去操作DOM,于是就想进一步去探究下为什么大家都会这样说,在网上学习了一些资料,这边整理出来. 首先,DOM对象本身也是一个js对象,所以严格来说,并不是操作这个对象慢 ...
- 深入理解JS执行细节(写的很精辟)
来源于:http://www.cnblogs.com/onepixel/p/5090799.html javascript从定义到执行,JS引擎在实现层做了很多初始化工作,因此在学习JS引擎工作机制之 ...
- JS组件系列——表格组件神器:bootstrap table 包含了js对象的定义和对象成员函数的定义
前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...
- Vue之挂载点、变量、事件、js对象、文本指令、过滤器、事件指令和属性指令
1.vue导入-挂载点 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=&qu ...
- JS对象继承篇
JS对象继承篇 ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的 原型链 其基本思路是利用原型让一个引用类型继承另一个引用类型的属性和方法 function Person() ...
- JS 对象封装的常用方式
JS是一门面向对象语言,其对象是用prototype属性来模拟的,下面,来看看如何封装JS对象. 常规封装 function Person (name,age,sex){ this.name = na ...
- JSON字符串和JS对象之间的转换
JSON字符串和JS对象之间的转换 1 json字符串转换为js对象 1.1 标准json格式字符串转换为Js对象 JSON字符串 str JSON.parse(str) eval(str) eva ...
- js 对象的_proto_
js 对象呢,有个属性叫_proto_,以前没听说过,也没关注,最近看这个原型,就被迫知道了这个东西,js 这里面的东西,真是规定的很奇怪,具体为啥也不知道,就测试发现的,对象的_proto_属性,和 ...
随机推荐
- git 项目切换分支 命令
在项目开发总,一般都会用到git管理工具,有的公司可能还是用的svn:不管怎么样.用的顺手就行: 来说下git 的基本使用 git clone + 项目地址链接: 可以把项目克隆到本地: 然后一般顺序 ...
- Event Handling Guide for iOS--事件驱动指南
事件是发送给应用程序来通知它用户动作的对象.在iOS中,事件可以有多种形式:多触摸事件,motion(,移动,手 势)事件---例如,设备的加速计(accelerometer)--和控制多媒体的事件. ...
- 运行scrapyd报错
转自: https://blog.csdn.net/qq_29719097/article/details/89431234 web.Server Traceback (most recent ...
- js同过url下载文件,调用另存为弹框
实战中,项目将文件上传到项目的根目录下,并进行保存,随后根据此文件的路径进行下载到本地磁盘 实战中,项目将文件上传到项目的根目录下,并进行保存,随后根据此文件的路径进行下载到本地磁盘 实战中,项目将文 ...
- [洛谷P3512 [POI2010]PIL-Pilots]
题目链接: 传送门走这里 题目分析: 感觉不是很难啊--不像是蓝题(AC量也不像)恶意评分? 少打了一个+1调了半天,就这样居然还能过60pts?我思路和题解第一篇高度重合是什么鬼啊,太过分了吧本来还 ...
- 堆参数-XMS 与-XMX的说明
XMS : JVM初始分配的堆内存 XMX : JVM最大允许分配的堆内存,按需分配 堆内存分配: JVM初始分配的堆内存由-Xms指定,默认是物理内存的1/64: JVM最大分配的堆内存由-Xmx指 ...
- EmitMapper系列之一:EmitMapper入门
EmitMapper的总结 EmitMapper简介 前言: 参考官网: http://emitmapper.codeplex.com/ Project Description Powerful cu ...
- lock和synchronized的同步区别与选择
1. lock是一个接口,而synchronized是java的一个关键字,synchronized是内置的语言实现:(具体实现上的区别在<Java虚拟机>中有讲解底层的CAS不同,以前有 ...
- springboot项目启动问题
在调试项目的时候有遇到这样一个问题: 项目启动后访问不通,编译没有任何问题,启动也没有报错,日志在打,但是访问不通.而且之前一直可以正常访问,在没改任何代码的情况下不能访问了. 尝试很多次偶然发现,点 ...
- layer设置弹出全屏
//弹出即全屏 var index = layer.open({ type: , content: 'http://www.layui.com', area: ['300px', '195px'], ...