JavaScrip对象和数组

最新推荐文章于 2025-11-26 15:59:01 发布
原创 最新推荐文章于 2025-11-26 15:59:01 发布 · 122 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#前端

本文通过三个小练习介绍了JavaScript中对象属性动态访问、数组concat方法和splice方法的使用。用户输入颜色猜保时捷游戏展示了obj[key]的运用；concat用于合并两个数组并创建新数组，同时展示如何在页面上显示合并结果；splice练习涉及删除或添加数组元素，根据用户输入操作数组。这些练习旨在提升JavaScript基础操作技能。

一，obj[key]

 

小练习obj[key]

            一个按钮 点击 弹出prompt 猜猜保时捷的颜色

用户输入之后 给obj添加属性color 值就是用户输入的颜色

开始循环对象，如果color的值是红色，则alert('恭喜你猜对了')

否则就提示 alert('你猜错请刷新页面继续猜')

二，concat

合并两个数组并生成一个新数组（不会改变原数组）

关于concat的小练习

 原来有个数组 let arr = ['奥迪','宝马','奔驰']

还有个空数组 let arr2 = []

页面上有个按钮叫添加 点一下 弹出一个prompt 你输入一辆汽车的品牌

添加到arr2 当中还有个按钮叫合并 可以把arr 和 arr2 合并成一个新数组

并且循环整个新数组 把新数组的每一个值都打印在页面上

 三，splice

splice 三个参数

        第一个参数表示 所在数组的位置

        第二个参数表示 删除几个

        第三个参数表示 添加的内容

 关于splice小练习

 点击删除按钮 弹出prompt弹框，输入汽车品牌，

 如果存在于arr 就把他删掉

 不存在 就把他添加到 数组的第二个位置

详解JavaScript对象和数组
10-23
对于JavaScript初学者来说，理解对象和数组是至关重要的。对象和数组不仅提供了丰富的数据结构，也使得操作这些数据变得方便和直观。通过面向对象的方法，可以将相关的数据和功能组织在一起，提高代码的可读性和可...
node-test-constructs:用于测试目的JavaScript对象和数组
05-03
用于测试目的JavaScript对象和数组。 正在安装 npm install --save-dev test-constructs 快速开始 const tc = require ( 'test-constructs' ) console . log ( tc . rndObject ( ) ) // <= A random object ...
【Java Script 零基础入门】对象的创建与遍历
weixin_52212950的博客
05-14 1053
这篇文章带大家进入 Java Script 的对象阶段，Java Script 可以说是万物皆对象。对象是引用数据类型，是保存复杂数据类型的容器，它是多个属性和方法的集合。 这篇文章的目标有两个： 📑目标一：学会创建对象的三种方式 📑目标二：学会遍历对象的两种方式 .........
JavaScrip数组方法大总结
qq_44665456的博客
04-20 311
一、创建数组的方法“ 字面量方式（json 方式） var arr1 = []; var arr2 = [1]; 构造函数方式 var arr1 = new Array(); // 创建一个空数组 var arr2 = new Array(2); // 创建一个长度为2，值为空的数组 var arr2 = new Array(1,2,3) // 创建一个具有多个元素的数组 二、数组方法概括 方法名 功能 concat(0) 合并数组，并返回合并之后的数据 join() 使用
javascript数组——新建数组、访问数组、遍历数组的方法、数组对象的方法、冒泡排序算法、json的正反序列化
TKY666的博客
04-14 1857
数组 是可以在内存中连续存储多个元素的结构 数组的下标索引从0开始，通过length可获取数组的总长度。取值范围[0 , myarr.length-1] 通过构造函数的三种方法 例1： var myarr= new Array() myarr[0]=10; myarr[2]="hello"; 例2： var myarr= new Array(10，"hello")(长度为2 ，) 例3： var myarr= new Array(10) (创建一个长度为10的数组每个元素都为空 只有一..
JavaScript第五天学习总结—— 对象、创建对象的三种方式、遍历对象
weixin_52819925的博客
08-04 796
对象的相关概念 什么是对象？ 在 JavaScript 中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象，例如字符串、数值、数组、函数等。 对象是由属性和方法组成的 属性：事物的特征，在对象中用属性来表示（常用名词） 方法：事物的行为，在对象中用方法来表示（常用动词） [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-CxMlEWd1-1628091491881)(C:\Users\26036\Desktop\images\图片3.png)]
JavaScrip整理及常用方法
m0_53858733的博客
01-01 404
JavaScript 目录JavaScript1、JavaScript是什么2、入门3、数据类型(1).变量的定义(2).字符串(3).数组(4).对象(5).流程控制(6).Map和 Set4、函数(1).定义函数(2).变量的作用域(3).方法5、内部对象(1).Date(2).JSON6、面向对象编程(1).定义类(2).继承类(3).原型链 1、JavaScript是什么 用来前端页面简单逻辑和与后端的交互 JavaScript（简称“JS”） 是一种具有函数优先的轻量级，解释型或即时编译型的
JavaScript 对象和数组
Flying_Fish_roe的博客
12-31 1003
在 JavaScript 中，对象是一种用于存储键值对的数据结构。它可以包含任意数量的属性，每个属性由键和值组成。数组是用于存储有序数据的结构，每个元素都有一个对应的索引（从 0 开始）。对象和数组是 JavaScript 中的基础数据结构，它们在存储、操作和管理数据时非常高效且灵活。通过熟练掌握它们的基本用法和高级操作，开发者可以轻松构建复杂的数据逻辑，同时提高代码的可读性和性能。在实际开发中，结合具体业务需求选择合适的实现方式，将显著提升开发效率和应用性能。
JavaScript——对象和数组
aliyun3的博客
04-09 549
什么是对象：其实就是一种类型，即引用类型。而对象的值就是引用类型的实例。在ECMAScript中引用类型是一种数据结构，用于将数据和功能组织在一起。它也常被称做为类，但ECMAScript中却没有这种东西。虽然ECMAScript是一门面向对象的语言，却不具备传统面向对象语言所支持的类和接口等基本结构。 Object类型 到目前为止，我们使用的引用类型最多的可能就是Object类型了。虽然Object的实例不具备多少功能，但对于在应用程序中的存储和传输数据而言，它确实是非常理想的选择。 创建Obje
JavaScript对象和数组赋值
七月❤的博客
08-26 920
对象赋值 const person = {} person = { name:xxx, age:xxx, number:xxx } 数组赋值 const arr = [ {name:'Lily',age:15}, {name:'genasj',age:18}, {name:'lazy',age:16}, ] const data = [] arr.foreach(item=>{ data.push({ name1:item.name, age1:i
练习 JavaScript 对象和数组.zip
11-25
练习 JavaScript 对象和数组LAB | JS Clue（混合对象和数组）学习目标介绍你还记得经典侦探桌游《妙探寻凶》吗？它是 90 年代非常流行的一款游戏。剧情从都铎庄园的巨富博迪先生的死亡开始。博迪先生是在极为可疑的...
idx遍历JavaScript对象和数组属性的实用工具
08-12
"idx"是一个实用工具库，专为遍历JavaScript对象和数组属性而设计，它简化了对这些数据结构的访问和操作。 在JavaScript中，对象可以看作是键值对的集合，而数组则是一系列有序元素的集合。遍历这些数据结构通常...
Vue开发工具使用技巧
2509_93946471的博客
11-24 318
打开DevTools的"Events"标签页，所有组件间传递的事件都会按时间顺序列出来，连事件负载数据都能展开看详情。更绝的是，你还能手动触发事件——比如在父组件里模拟一个事件，直接测试子组件的响应逻辑，省得反复修改代码来调试。如果组件用了作用域插槽，可以在"Scoped Slots"子面板里实时查看slot传递的数据内容，比在模板里写调试代码清爽得多。路由调试经常被忽略。热重载调试时，如果发现修改代码后页面没及时更新，可以到DevTools的"Settings"里勾选"Log reloads"选项。
TypeScript类型推断
2509_93947330的博客
11-23 336
它让我们在享受静态类型检查好处的同时，减少了类型注解的负担，真正体现了TypeScript的设计哲学——在JavaScript的基础上添加静态类型，而不是改变JavaScript的编程模式。例如在DOM事件监听中，写时，虽然我们没有标注event参数的类型，但TypeScript能根据addEventListener的上下文推断出event是MouseEvent类型。当你定义时，TypeScript会推断name为string类型，age为number类型，而不是特定的字面量类型。
Rust高性能Web后端服务开发与Actix-Web实战分享：零成本抽象、高并发处理与内存安全实践
2501_94181083的博客
11-23 745
数据序列化使用bincode替代 JSON：节省 30% CPU对热点代码进行#[inline]展开Netty 式 Reactor 模型减少线程调度开销批量 DB 提交减少 IO 压力缓存热点业务路径到 Redis最终整个平台达成：单机 QPS：18 万P99 延迟 < 30msCPU 占用在可控范围内资源释放完全可预期，无内存泄漏风险高性能，无 GC 停顿编译期保证内存安全，避免线上事故Actix-Web 性能强劲，适合高并发系统适合对性能和稳定性要求极高的互联网生产环境。
Vue 项目实战《尚医通》，路由鉴权完成，笔记71
Rockandrollman的博客
11-23 149
Vue 项目实战《尚医通》，路由鉴权完成，笔记71
MyBatis + PageHelper 分页内幕，PageHelper 是如何动态构建 LIMIT 分页 SQL 的
最新发布
日常笔记 | 干货分享 | 毕设源码 | 毕设指导 | 答辩指导
11-26 298
若依系统中有很多的表格数据、后端接口实体中并没有看到有接收分页大小和页码的属性，在系统的mapper层面SQL语句中并没有看到对应的分页限制。它是如何实现这个分页效果的呢？是将所有的数据查询出来，然后再分页吗？这样效率岂不是非常低。带着这样的疑问，稍微研究了一下这个系统的分页方法。更多详细文章后端是通过从 HttpServletRequest 对象中获取分页的页码和大小，然后创建Page分页对象，在执行sql查询的时候，动态构建分页限制条件。从而实现分页，并不是在查询到所有数据之后再进行的分页处理。
一文让你了解UI自动化测试
HUACE4600的博客
11-26 727
这些资料，对于做【软件测试】的朋友来说应该是最全面最完整的备战仓库，这个仓库也陪伴我走过了最艰难的路程，希望也能帮助到你！凡事要趁早，特别是技术行业，一定要提升技术功底。
Python全栈开发项目——AI智能聊天机器人
qiao_yue的博客
11-24 805
本项目实现了AI聊天功能，具有语音输入和聊天背景自定义等亮点功能
JavaScript 对象和数组参考手册
JavaScript 中的对象和数组是两种基本的数据类型，对象是键值对的集合，而数组是值的有序集合。下面将对 JavaScript 中的一些常用对象和数组进行详细介绍。 ### Anchor 对象 Anchor 对象是 HTML 的锚点对象，通过 ...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值