JS-part14.3-了解对象 / 数据劫持

Javascript

  • 对象
    • for in 循环
    • 对象自己的方法
      • hasOwnProperty()
      • defineProperty() 数据劫持
        • 数据劫持的意义

对象

对象
  + 我们数据类型的一种
  + 以键值对的形式存储数据
  + 因为 __proto__ 和 原型链 可以访问自己没有的属性

for in 循环

for in 循环
  + 专门遍历对象
  + 遍历对象身上的所有属性
  + 遍历对象身上所有的 可枚举 的属性(包括原型链上的所有 可枚举 属性)
    => 一种是自定义的属性
    => 我们可以自己设置为可枚举属性
function Person(){
   
    this.name = 'Jack'
    this.age = 18
    this.gender = '男'
}

Person.prototype.sayHi = function(){
    console.log('hello world') }

let p1 = new Person()
console.log(p1)

for(key in p1){
   
    console.log('我执行了', key )
}

遍历到了 4 个属性/方法
JS-part14.3-了解对象 / 数据劫持_第1张图片

而对象自己的 contructor 属性和 以下这些方法并没有被遍历出来

JS-part14.3-了解对象 / 数据劫持_第2张图片
问题:

  1. 为啥? (因为 可枚举 标志为 false, 不是可枚举属性)

  2. 如何判断某个属性是对象自己身上的还是原型链上的?
    因为自己的可以修改, 而原型上的不能轻易修改, 因为是和其他实例共用的

我们来看看这些对象自己的方法

对象自己的方法

hasOwnProperty()

=> 查看是不是自己的属性
=> 语法: 对象.hasOwnProperty('你要检测的属性名')
console.log(p1.hasOwnProperty('name'))  // true
console.log(p1.hasOwnProperty('sayHi'))  // false

在这里插入图片描述

defineProperty() 数据劫持

=> 一种给对象添加属性的方法
=> 我可以给一个我设置的属性设置各种各样的行为状态(例如: 是否可修改, 是否可枚举)
=> 语法: Object.defineProperty(给哪一个对象添加, 添加的 key, {
              所有添加的设置
          })
// 数据劫持
let obj = {
   
    name: 'Jack'
}
// 普通添加
obj.age = 18

// 数据劫持
Object.

你可能感兴趣的:(Web开发,javascript)