平时在写的代码过程中,经常会遇到对对象Object的数据处理。而在对对象的数据处理中,操作最频繁的是“数据引用”、“值的修改”、“获取关键字(属性)”。平时最烦的也是“获取关键字”,经常忘记怎么去获取,这里做一下整理。

既然要"获取关键字",那么得首先有一个对象才行。创建对象的方式很多,我自己惯用的方式有三种:

1、通过原始构造函数 new Object();创建一个对象,然后赋值;

var testObj= new Object();
testObj.name = "shangguan";
testObj.age= 25;
testObj.action = function () {
return this.name;
}

2、直接新建对象,不通过构造函数(而且直接新建速度比构造器还快一些!)

var testObj={};
testObj.name = "shangguan";
testObj.age= 25;
testObj.action = function () {
return this.name;
};

3、重载构造器,让构造器在构造对象时按预定的属性构建。

// 创建一个对象的构造方法
function newObj(name, age) {
this.name = name;
this.age= age;
this.action = function () {
return this.name;
}
}
// 创建一个对象
var testObj= new newObj("shangguan", 25);

1、对象内置属性方法:Object.keys();该方法返回一个数组,数组内包括对象内可枚举属性以及方法名称。数组中属性名的排列顺序和使用 for...in 遍历该对象时返回的顺序一致。

  // 通过调用Object.keys()方法,获取对象上已定义(可枚举)的属性和方法

  var keys= Object.keys(testObj);
  console.log(keys); // 输出 keys ["name", "age", "action"]

   

  注意:在ES5里,如果此方法的参数不是对象(而是一个原始值),那么它会抛出 TypeError。而在ES2015中,非对象的参数将被强制转换为一个对象。

  Object.keys("testObj");
  // TypeError: "testObj" is not an object (ES5 code)
  Object.keys("testObj");
  //["name", "age", "action"] (ES2015 code)

2、Object.getOwnPropertyNames():方法返回一个指定对象所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组

  该数组是 obj自身拥有的枚举或不可枚举属性名称字符串集合。 数组中枚举属性的顺序与通过 for...in 循环(或 Object.keys())迭代该对象属性时一致。数组中不可枚举属性的顺序未定义。

  var keys = Object.getOwnPropertyNames(testObj);
  console.log(keys);  // 输出 keys ["name", "age", "action"]

  

3、当然除了以上两个外,还有最原始的 for...in 循环(估计是平时循环用的多了,反倒是这个不怎么用!)

  var keys =[];
  for(var i in testObj){
  keys.push(i);
  }
  console.log(keys); // keys ["name", "age", "action"]

  

下面通过一个实例,直观说明三者之间的区别:

var testObj = Object.create({}, {
getFoo: {
value: function () {
return this.foo;
},
enumerable: false
}
});
testObj.name = "shangguan";
testObj.age = 25;
testObj.action = function(){
return this.name;
};
function getKeys() {
// 获取对象可枚举和不可枚举的属性
console.log(Object.getOwnPropertyNames(testObj)); //输出:["getFoo", "name", "age", "action"]
// 获取对象可枚举的属性
console.log(Object.keys(testObj)); //输出:["name", "age", "action"]
// 获取对象可枚举的属性
for (var i in testObj) {
console.log(i); //输出 name,age,action
}
//返回直接定义在该对象上的可枚举属性,非继承。通过hasOwnProperty()方法可以将那些属性是对象自身(非继承)属性筛选出来,从而将不可枚举属性排除出去
//obj.hasOwnProperty(prop): prop要检测的属性,字符串 名称或者 Symbol。 返回值:用来判断某个对象是否含有指定的属性 的Boolean值
for (var i in testObj) {
if(testObj.hasOwnProperty(i)) {
console.log(i);
} //输出 name,age,action
}
}

  

  总结:如果只需要获取可枚举属性,那么Object.keys()for...in循环迭代即可(Object.getOwnPropertyNames()也可以获取到原型链上的可枚举属性,不过需要通过hasOwnProperty()方法过滤掉不可枚举属性)。

JS获取对象“属性和方法”的方法的更多相关文章

  1. js获取对象属性的两种方法,object.属性名,[‘属性名’ ]

    1.通过点的方式 2.通过括号的方式 例: <input type="text" value="hello" id="text"/&g ...

  2. js 获取对象属性个数

    js 获取对象属性个数 方法一: var attributeCount = function(obj) { var count = 0; for(var i in obj) { if(obj.hasO ...

  3. JS获取对象属性名小结

    最近面试遇到问如何获取对象全部属性名的方法,总结一下: 对象属性类型分类: 1.ESMAScript分类 数据类型 又分为可枚举和不可枚举类型 访问器类型 2.上下文分类 原型属性 实例属性 1.列举 ...

  4. JS获取对象“属性”的方法

    var testObj= new Object(); testObj.name = "shangguan"; testObj.age= ; testObj.action = fun ...

  5. js访问对象属性的两种方法

    var obj={name:'fuuf',age:19} 第一种,用.访问 obj.name 第二种 用[]访问 obj['name']  //此时name是字符串,要加引号 注意事项 使用第二种方法 ...

  6. JS获取节点属性个数及值得方法

    var ex = node; ; for (var j in ex) { alert("" + myIndex + ".(<font color='blue'> ...

  7. js 获取 对象 属性名称(转载)

    来源:https://www.cnblogs.com/YuyuanNo1/p/9257634.html dataObj = {name : su,age : 26,height : 18cm }; f ...

  8. 转: JavaScript 获取对象属性和方法

    一.获取对象属性和方法 Object.keys()for in 返回对象的可枚举属性和方法的名称数组. Object.getOwnPropertyNames() 返回的数组的所有属性(可枚举或不可枚举 ...

  9. JavaScript 获取对象属性和方法

    ShineJaie 原创整理,转载请注明出处. 一.获取对象属性和方法 Object.keys() 返回对象的可枚举属性和方法的名称数组. Object.getOwnPropertyNames() 返 ...

随机推荐

  1. java文件上传-原始的Servlet方式

    前言: 干了这几个项目,也做过几次文件上传下载,要么是copy项目以前的代码,要么是百度的,虽然做出来了,但学习一下原理弄透彻还是很有必要的.刚出去转了一圈看周围有没有租房的,在北京出去找房子是心里感 ...

  2. svn新增文件时自动给文件设置强制只读属性needs-lock

    1.从SVN客户端的“设置”->常规设置-> Subversion->Subversion 配置文件-> 编辑按钮 -> 打开配置文件 2.找到[miscellany], ...

  3. 【树】Convert Sorted Array to Binary Search Tree

    题目: Given an array where elements are sorted in ascending order, convert it to a height balanced BST ...

  4. Maven 学习笔记(三)

    Maven生命周期 在上次我们使用maven package 对项目进行打包.这里就是为其指定一个生命周期.生命周期是包含在一个项目构建中的一系列有序的阶段.Maven有许多不同的生命周期,比如验证( ...

  5. HMM分词实例

    class HMM(object): def __init__(self): import os # 主要是用于存取算法中间结果,不用每次都训练模型 self.model_file = 'model/ ...

  6. 在没有jre环境下运行jar

    1.首先将程序打包(这一步可以通过eclipse的导出完成). 2.为项目添加第三方jar包.在第1步打好的jar包的同级目录下,新建一个lib(名字可以自取)文件夹.用winrar等解压文件打开第1 ...

  7. spring boot 2.0 源码分析(四)

    在上一章的源码分析里,我们知道了spring boot 2.0中的环境是如何区分普通环境和web环境的,以及如何准备运行时环境和应用上下文的,今天我们继续分析一下run函数接下来又做了那些事情.先把r ...

  8. 关于js的 for...in 你了解多少

    For...In 声明用于对数组或者对象的属性进行循环/迭代操作. 1. 求value: 对于数组 ,迭代出来的是数组元素,对于对象,迭代出来的是对象的属性值: 1)数组示例 var x var my ...

  9. Java Bad version

    Eclipse的三个地方需要重新设置: 在工程上点右键,选属性,三个地方: Java Build Path Java Compiler Project Facets:这个地方还可以设置tomcat的r ...

  10. JBoss 实战(2)

    转自:https://www.cnblogs.com/aiwz/p/6154591.html JBOSS HTTP的Thread Group概念 JBOSS是一个企业级的J2EE APP Contai ...