CD's blog CD's blog
首页
  • HTMLCSS
  • JavaScript
  • Vue
  • TypeScript
  • React
  • Node
  • Webpack
  • Git
  • Nestjs
  • 小程序
  • 浏览器网络
  • 学习笔记

    • 《TypeScript 从零实现 axios》
    • Webpack笔记
  • JS/TS教程

    • 《现代JavaScript》教程
🔧工具方法
  • 网站
  • 资源
  • Vue资源
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

CD_wOw

内卷的行情,到不了的梦
首页
  • HTMLCSS
  • JavaScript
  • Vue
  • TypeScript
  • React
  • Node
  • Webpack
  • Git
  • Nestjs
  • 小程序
  • 浏览器网络
  • 学习笔记

    • 《TypeScript 从零实现 axios》
    • Webpack笔记
  • JS/TS教程

    • 《现代JavaScript》教程
🔧工具方法
  • 网站
  • 资源
  • Vue资源
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • 简介

  • JavaScript 基础知识

    • 空值合并运算符
    • 变量
    • 循环和for
    • Switch语句
    • Symbol类型
    • 对象
      • 属性存在性测试, ‘in’操作符
    • 对象引用和复制
    • 构造器和操作符“new”
    • 垃圾回收
    • 可选链
  • 数据类型

  • 函数进阶内容

  • 对象属性配置

  • 原型,继承

  • 类

  • 错误处理

  • Promise,asyncawait

  • Generator,高级 iteration

  • 模块

  • 杂项

  • 《现代JavaScript》教程
  • JavaScript 基础知识
CD_wOw
2020-12-06
目录

对象

# 属性存在性测试, ‘in’操作符

相比于其他语言,JavaScript 的对象有一个需要注意的特性:能够被访问任何属性。即使属性不存在也不会报错!

读取不存在的属性只会得到 undefined。所以我们可以很容易地判断一个属性是否存在:

let user = {};

alert( user.noSuchProperty === undefined ); // true 意思是没有这个属性
1
2
3

这里还有一个特别的,检查属性是否存在的操作符 "in"。

语法是:

"key" in object
1

例如:

let user = { name: "John", age: 30 };

alert( "age" in user ); // true,user.age 存在
alert( "blabla" in user ); // false,user.blabla 不存在。
1
2
3
4

请注意,in 的左边必须是 属性名。通常是一个带引号的字符串。

如果我们省略引号,就意味着左边是一个变量,它应该包含要判断的实际属性名。例如:

let user = { age: 30 };

let key = "age";
alert( key in user ); // true,属性 "age" 存在
1
2
3
4

为何会有 in 运算符呢?与 undefined 进行比较来判断还不够吗?

确实,大部分情况下与 undefined 进行比较来判断就可以了。但有一个例外情况,这种比对方式会有问题,但 in 运算符的判断结果仍是对的。

那就是属性存在,但存储的值是 undefined 的时候:

let obj = {
  test: undefined
};

alert( obj.test ); // 显示 undefined,所以属性不存在?

alert( "test" in obj ); // true,属性存在!
1
2
3
4
5
6
7

在上面的代码中,属性 obj.test 事实上是存在的,所以 in 操作符检查通过。

这种情况很少发生,因为通常情况下不应该给对象赋值 undefined。我们通常会用 null 来表示未知的或者空的值。因此,in 运算符是代码中的特殊来宾。

编辑 (opens new window)
#现代JavaScript
上次更新: 2021/08/22, 01:09:59
Symbol类型
对象引用和复制

← Symbol类型 对象引用和复制→

最近更新
01
gsap动画库学习笔记 - 持续~
06-05
02
远程组件加载方案笔记
05-03
03
小程序使用笔记
03-29
更多文章>
Theme by Vdoing | Copyright © 2020-2023 CD | MIT License
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式