原型和原型链

在对象自身身上找不到指定属性时,就会到这个对象的原型__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 对象细节的更多相关文章

  1. 深入理解JS 执行细节

    javascript从定义到执行,JS引擎在实现层做了很多初始化工作,因此在学习JS引擎工作机制之前,我们需要引入几个相关的概念:执行环境栈.全局对象.执行环境.变量对象.活动对象.作用域和作用域链等 ...

  2. DOM对象本身也是一个js对象,所以严格来说,并不是操作这个对象慢,而是说操作了这个对象后,会触发一些浏览器行为(转)

    一直都听说DOM很慢,要尽量少的去操作DOM,于是就想进一步去探究下为什么大家都会这样说,在网上学习了一些资料,这边整理出来. 首先,DOM对象本身也是一个js对象,所以严格来说,并不是操作这个对象慢 ...

  3. 深入理解JS执行细节(写的很精辟)

    来源于:http://www.cnblogs.com/onepixel/p/5090799.html javascript从定义到执行,JS引擎在实现层做了很多初始化工作,因此在学习JS引擎工作机制之 ...

  4. JS组件系列——表格组件神器:bootstrap table 包含了js对象的定义和对象成员函数的定义

    前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...

  5. Vue之挂载点、变量、事件、js对象、文本指令、过滤器、事件指令和属性指令

    1.vue导入-挂载点 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=&qu ...

  6. JS对象继承篇

    JS对象继承篇 ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的 原型链 其基本思路是利用原型让一个引用类型继承另一个引用类型的属性和方法 function Person() ...

  7. JS 对象封装的常用方式

    JS是一门面向对象语言,其对象是用prototype属性来模拟的,下面,来看看如何封装JS对象. 常规封装 function Person (name,age,sex){ this.name = na ...

  8. JSON字符串和JS对象之间的转换

    JSON字符串和JS对象之间的转换 1 json字符串转换为js对象 1.1 标准json格式字符串转换为Js对象  JSON字符串 str JSON.parse(str) eval(str) eva ...

  9. js 对象的_proto_

    js 对象呢,有个属性叫_proto_,以前没听说过,也没关注,最近看这个原型,就被迫知道了这个东西,js 这里面的东西,真是规定的很奇怪,具体为啥也不知道,就测试发现的,对象的_proto_属性,和 ...

随机推荐

  1. c#删除指定文件夹中今天之前的文件

    1.说明 使用Directory类对指定文件夹下的今天或者更早日期之前的文件进行删除.原文链接:http://www.cnblogs.com/lengzhan/p/6423943.html 2.代码 ...

  2. USACO Training3.1联系【排序终极题目】By cellur925

    题目传送门 这题我们很容易想到直接枚举即可.算法本身并没有什么难度但是细节超多!于是这题整整卡了一天....... (不,还是我太弱了.) 期间还暴露出一些平时没有特别注意的问题,这次一起解决. 开始 ...

  3. 449B

    B. Chtholly's request time limit per test 2 seconds memory limit per test 256 megabytes input standa ...

  4. html 文本溢出显示省略号 .....

  5. LightOj 1076 - Get the Containers (折半枚举好题)

    题目链接: http://www.lightoj.com/volume_showproblem.php?problem=1076 题目描述: 给出n个数,要求分成m段,问这m段中最大的总和,最小是多少 ...

  6. bryce1010专题训练——树状数组

    Bryce1010模板 1.一维树状数组 https://vjudge.net/contest/239647#problem/A[HDU1556] #include<bits/stdc++.h& ...

  7. 注册jdbc驱动的三种方式

    java.sql.DriverManger类简介   java的驱动管理类.管理一组 JDBC 驱动程序. javax.sql.DataSource 接口是 JDBC 2.0 API 中的新增内容,它 ...

  8. win10下JDK安装,配置环境变量后报Error: could not open `C:\Program Files\Java\jre1.8.0_112\lib\amd64\jvm.cfg'

    把Path里面的%JAVA_HOME%/bin放在最前面.

  9. RHEL 6.5---SVN服务实现过程

    主机名 IP地址  master 192.168.30.130 slave 192.168.30.131 安装 [root@master ~]# yum install -y subversion h ...

  10. Unity3D中GameObject 详细介绍

    通过Hierarchy面板下的Create菜单可以手动地创建一个GameObject,它可以是一个相机,一个灯光,或者一个简单的模型,当我们要在程序里面动态地创建一个相机的时候,可以new一个Game ...