JavaScript进阶内容详解

JavaScript进阶内容详解

记录js进阶学习的相关内容,本篇算是一个系列的开篇,计划深度学习和js以及v8引擎相关的部分内容。

1.对象

基础

对象用来存放键值对,其中值得注意的是,存在两种方法去创建一个空的的对象。

js 复制代码
let user = new Object() // 构造函数方法
let user = {} // "字面量"方法

可以使用delete方法去移除对象属性

js 复制代码
delete user.name

多词属性,需要给键名加上引号

js 复制代码
let user = {
    "login name": "xxx"
    temp: 123
}

方括号

对象名中可以是方括号,此为计算属性,如下,可从fruit中获取相应值,目前在前端框架中似乎很少会这样去用。可能是因为响应式存在的原因。

js 复制代码
let fruit = prompt('123', 'apple');
let user = {
    [fruit]: 5
};
console.log(user.apple);

其本质上,和下面的代码相同,由此可见js的自由性,感觉和自然语言也没有什么区别了

js 复制代码
let fruit = prompt('123', 'apple');
let bag = {};
bag[fruit] = 5;

属性存在测试,'in'操作符

如下,in用于判断当前对象中是否存在某一个键值

js 复制代码
let bag = {
    fruit: 'apple'
}
console.log("name" in bag) //false
console.log("fruit" in bag) //true

其基本作用实际和console.log(bag.name === undefined)类似,那么既然可以通过undefine来判断是否存在键值,要in还有什么作用呢?那就是键名存在,但是其值为undefined的情况。

js 复制代码
let bag = {
    fruit: undefined
}

console.log(bag.fruit === undefiend) //false
console.log("fruit" in bag) //true

对象的排序

整数会按照升序排列,其他会按照创建顺序排列(注意:Number只能转化整数,如Number('1.2')就是错的)

相关推荐
大鸡爪1 小时前
Vue3 组件库实战(五):Icon 图标组件的设计与实现
前端·vue.js
bluceli1 小时前
前端测试实战指南:构建高质量代码的完整体系
前端·测试
行走的陀螺仪1 小时前
前端公共库开发保姆级路线:从0到1复刻VueUse官方级架构(pnpm+Turbo+VitePress)
前端·架构
顽固_倔强1 小时前
深入理解 Vue3 数据绑定实现原理
前端·面试
前端付豪1 小时前
组件拆分重构 App.vue
前端·架构·代码规范
Wect1 小时前
React 更新触发原理详解
前端·react.js·面试
cxxcode1 小时前
Web 帧渲染与 DOM 准备
前端
光影少年2 小时前
React Hooks的理解?常用的有哪些?
前端·react.js·掘金·金石计划
大鸡爪2 小时前
Vue3 组件库实战(七):从本地到 NPM:版本管理与自动化发布指南(下)
前端·vue.js