JavaWeb(4)JavaScript入门2—— JS的对象和JSON

一、JS的对象

1.声明语法1

通过new Object()直接创建对象

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>/* 方式1 new Object()方式2 {属性名:属性值,......,函数名:function(){}}*/var Person = new Object;//对象的属性?添加属性Person.name = "Theodore";Person.id = "theodore1022";//对象的方法?添加方法Person.write = function(blog){console.log("id为"+this.id+",名字为:"+this.name+"的博主正在写"+blog)}//访问属性console.log(Person.id)console.log(Person.name)//调用方法Person.write("有关JS的博客")</script>
</head>
<body></body>
</html>

2. 声明语法2

语法为 var person ={"属性名":"属性值","属性名","属性值","函数名":函数}

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>/* 方式1 new Object()方式2 {属性名:属性值,......,函数名:function(){}}*///方式2:var Person = {name:"andy","id" : 10,"write" : function(blog){console.log("id为"+this.id+",名字为:"+this.name+"的博主正在写"+blog)}}Person.write("有关JS的博客")</script>
</head>
<body></body>
</html>

 二、JSON

1.定义

        JSON 就是一种字符串格式,这种格式无论是在前端还是在后端,都可以很容易的转换成对象,所以常用于前后端数据传递。

2.说明

  • JSON的语法

    var obj="{'属性名':'属性值','属性名':{'属性名':'属性值'},'属性名':['值1','值1','值3']}"

  • JSON字符串一般用于传递数据,所以字符串中的函数就显得没有意义,在此不做研究

  • 通过JSON.parse()方法可以将一个JSON串转换成对象

  • 通过JSON.stringify()方法可以将一个对象转换成一个JSON格式的字符串

3.代码演示

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>/* JSON格式的语法var personStr = '{"属性名":"属性值","属性名":"属性值","属性名":{},"属性名":["","",""],"属性名":[{},{},{}]}'属性名必须用""包裹上属性值 字符串必须用“”包好,数字可以不处理*///JSON格式的字符串var personStr = '{"name":"theodore","age":"20","dog":{"dname":"大黄"},"loveSingers":["林俊杰","周杰伦","陶喆"],"friends":[{"fname":"唐三"},{"fname":"喜洋洋"},{"fname":"灰太狼"}]}'// console.log(personStr)// console.log(typeof personStr)// console.log(personStr.name)//通过JSON.parse() 可以将一个JSON串转换为一个对象var person = JSON.parse(personStr)console.log(personStr)console.log(person)console.log(person.dog.dname)console.log(person.loveSingers[0])console.log(person.friends[0].fname)//通过JSON.stringify()将一个对象转换为JSON串var personStr2 = JSON.stringify(person)console.log(personStr2)</script></head>
<body>

4.创建数组

  • new Array() 创建空数组

  • new Array(5) 创建数组时给定长度

  • new Array(ele1,ele2,ele3,... ... ,elen); 创建数组时指定元素值

  • [ele1,ele2,ele3,... ... ,elen]; 相当于第三种语法的简写

5.常见对象

(1)Boolean对象

方法描述
toString()把布尔值转换为字符串,并返回结果。
valueOf()返回 Boolean 对象的原始值。

(2)Date对象

方法描述
getDate()从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay()从 Date 对象返回一周中的某一天 (0 ~ 6)。
getFullYear()从 Date 对象以四位数字返回年份。
getHours()返回 Date 对象的小时 (0 ~ 23)。
getMilliseconds()返回 Date 对象的毫秒(0 ~ 999)。
getMinutes()返回 Date 对象的分钟 (0 ~ 59)。
getMonth()从 Date 对象返回月份 (0 ~ 11)。
getSeconds()返回 Date 对象的秒数 (0 ~ 59)。
getTime()返回 1970 年 1 月 1 日至今的毫秒数。
getTimezoneOffset()返回本地时间与格林威治标准时间 (GMT) 的分钟差。
getUTCDate()根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。
getUTCDay()根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。
getUTCFullYear()根据世界时从 Date 对象返回四位数的年份。
getUTCHours()根据世界时返回 Date 对象的小时 (0 ~ 23)。
getUTCMilliseconds()根据世界时返回 Date 对象的毫秒(0 ~ 999)。
getUTCMinutes()根据世界时返回 Date 对象的分钟 (0 ~ 59)。
getUTCMonth()根据世界时从 Date 对象返回月份 (0 ~ 11)。
getUTCSeconds()根据世界时返回 Date 对象的秒钟 (0 ~ 59)。
getYear()已废弃。 请使用 getFullYear() 方法代替。
parse()返回1970年1月1日午夜到指定日期(字符串)的毫秒数。
setDate()设置 Date 对象中月的某一天 (1 ~ 31)。
setFullYear()设置 Date 对象中的年份(四位数字)。
setHours()设置 Date 对象中的小时 (0 ~ 23)。
setMilliseconds()设置 Date 对象中的毫秒 (0 ~ 999)。
setMinutes()设置 Date 对象中的分钟 (0 ~ 59)。
setMonth()设置 Date 对象中月份 (0 ~ 11)。
setSeconds()设置 Date 对象中的秒钟 (0 ~ 59)。
setTime()setTime() 方法以毫秒设置 Date 对象。
setUTCDate()根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。
setUTCFullYear()根据世界时设置 Date 对象中的年份(四位数字)。
setUTCHours()根据世界时设置 Date 对象中的小时 (0 ~ 23)。
setUTCMilliseconds()根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。
setUTCMinutes()根据世界时设置 Date 对象中的分钟 (0 ~ 59)。
setUTCMonth()根据世界时设置 Date 对象中的月份 (0 ~ 11)。
setUTCSeconds()setUTCSeconds() 方法用于根据世界时 (UTC) 设置指定时间的秒字段。
setYear()已废弃。请使用 setFullYear() 方法代替。
toDateString()把 Date 对象的日期部分转换为字符串。
toGMTString()已废弃。请使用 toUTCString() 方法代替。
toISOString()使用 ISO 标准返回字符串的日期格式。
toJSON()以 JSON 数据格式返回日期字符串。
toLocaleDateString()根据本地时间格式,把 Date 对象的日期部分转换为字符串。
toLocaleTimeString()根据本地时间格式,把 Date 对象的时间部分转换为字符串。
toLocaleString()根据本地时间格式,把 Date 对象转换为字符串。
toString()把 Date 对象转换为字符串。
toTimeString()把 Date 对象的时间部分转换为字符串。
toUTCString()根据世界时,把 Date 对象转换为字符串。实例:var today = new Date(); var UTCstring = today.toUTCString();
UTC()根据世界时返回 1970 年 1 月 1 日 到指定日期的毫秒数。
valueOf()返回 Date 对象的原始值。

(3)Math

方法描述
abs(x)返回 x 的绝对值。
acos(x)返回 x 的反余弦值。
asin(x)返回 x 的反正弦值。
atan(x)以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。
atan2(y,x)返回从 x 轴到点 (x,y) 的角度(介于 -PI/2 与 PI/2 弧度之间)。
ceil(x)对数进行上舍入。
cos(x)返回数的余弦。
exp(x)返回 Ex 的指数。
floor(x)对 x 进行下舍入。
log(x)返回数的自然对数(底为e)。
max(x,y,z,...,n)返回 x,y,z,...,n 中的最高值。
min(x,y,z,...,n)返回 x,y,z,...,n中的最低值。
pow(x,y)返回 x 的 y 次幂。
random()返回 0 ~ 1 之间的随机数。
round(x)四舍五入。
sin(x)返回数的正弦。
sqrt(x)返回数的平方根。
tan(x)返回角的正切。
tanh(x)返回一个数的双曲正切函数值。
trunc(x)将数字的小数部分去掉,只保留整数部分。

(4)Number

方法描述
isFinite检测指定参数是否为无穷大。
isInteger检测指定参数是否为整数。
isNaN检测指定参数是否为 NaN。
isSafeInteger检测指定参数是否为安全整数。
toExponential(x)把对象的值转换为指数计数法。
toFixed(x)把数字转换为字符串,结果的小数点后有指定位数的数字。
toLocaleString(locales, options)返回数字在特定语言环境下的表示字符串。
toPrecision(x)把数字格式化为指定的长度。
toString()把数字转换为字符串,使用指定的基数。
valueOf()返回一个 Number 对象的基本数字值。

(5)String

方法描述
charAt()返回在指定位置的字符。
charCodeAt()返回在指定的位置的字符的 Unicode 编码。
concat()连接两个或更多字符串,并返回新的字符串。
endsWith()判断当前字符串是否是以指定的子字符串结尾的(区分大小写)。
fromCharCode()将 Unicode 编码转为字符。
indexOf()返回某个指定的字符串值在字符串中首次出现的位置。
includes()查找字符串中是否包含指定的子字符串。
lastIndexOf()从后向前搜索字符串,并从起始位置(0)开始计算返回字符串最后出现的位置。
match()查找找到一个或多个正则表达式的匹配。
repeat()复制字符串指定次数,并将它们连接在一起返回。
replace()在字符串中查找匹配的子串,并替换与正则表达式匹配的子串。
replaceAll()在字符串中查找匹配的子串,并替换与正则表达式匹配的所有子串。
search()查找与正则表达式相匹配的值。
slice()提取字符串的片断,并在新的字符串中返回被提取的部分。
split()把字符串分割为字符串数组。
startsWith()查看字符串是否以指定的子字符串开头。
substr()从起始索引号提取字符串中指定数目的字符。
substring()提取字符串中两个指定的索引号之间的字符。
toLowerCase()把字符串转换为小写。
toUpperCase()把字符串转换为大写。
trim()去除字符串两边的空白。
toLocaleLowerCase()根据本地主机的语言环境把字符串转换为小写。
toLocaleUpperCase()根据本地主机的语言环境把字符串转换为大写。
valueOf()返回某个字符串对象的原始值。
toString()返回一个字符串。

总结

        本篇对JS的对象创建和JSON进行了概述,便于学习与应用。部分内容来自网络,如有侵权,请联系作者删除,谢谢!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/874886.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C#与C++交互开发系列(三):深入探讨P/Invoke基础知识

欢迎来到C#与C交互开发系列的第三篇。在这篇博客中&#xff0c;我们将深入探讨P/Invoke&#xff08;Platform Invocation Services&#xff09;的基础知识。P/Invoke是C#调用非托管代码的一种机制&#xff0c;能够让C#直接调用C编写的动态链接库&#xff08;DLL&#xff09;中的…

外六角半螺纹螺丝主要应用领域

外六角半螺纹螺丝&#xff0c;作为一种常见的紧固件&#xff0c;因其独特的设计和多样的功能而在多个工业领域中占据着重要的地位。这种螺丝的一端具有完整的螺纹&#xff0c;而另一端则可能没有螺纹或螺纹较短&#xff0c;这样的设计使其在某些应用场景中具有独特的优势。 应用…

docker文件挂载和宿主主机文件的关系

一、背景 在排查docker日志时发现在读取docker的文件时找不到文件&#xff0c;在宿主主机上可以查到对应的文件。这里就要理解docker文件目录和宿主主机上的文件的关系。 二、Docker文件系统和宿主系统 Docker文件和宿主文件之间的关系主要体现在Docker容器的运行环境中。Docke…

【目录】8051汇编与C语言系列教程

8051汇编与C语言系列教程 作者将狼才鲸创建日期2024-07-23 CSDN文章地址&#xff1a;【目录】8051汇编与C语言系列教程本Gitee仓库原始地址&#xff1a;才鲸嵌入式/8051_c51_单片机从汇编到C_从Boot到应用实践教程 一、本教程目录 序号教程名称简述教程链接1点亮LCD灯通过IO…

【分布式锁】Redission实现分布式锁

接着上一节&#xff0c;我们遇到了超卖的问题&#xff0c;并通过Redis实现分布式锁&#xff0c;进行了解决。本节 我将换一种方式实现分布式锁。 前提&#xff1a; nginx、redis、nacos 模块1&#xff1a; provider-and-consumer 端口 8023 模块2 rabbitmq-consumer 端口 8021 …

成都云飞浩容文化传媒有限公司电商服务新领航者

在电商的海洋里&#xff0c;无数企业如同繁星般闪烁&#xff0c;但其中有一颗璀璨的明星——成都云飞浩容文化传媒有限公司&#xff0c;以其专业的电商服务和独特的创新理念&#xff0c;成为行业的佼佼者。今天&#xff0c;就让我们一起走进云飞浩容&#xff0c;探索这家公司的…

# Redis 入门到精通(八)-- 服务器配置-redis.conf配置与高级数据类型

Redis 入门到精通&#xff08;八&#xff09;-- 服务器配置-redis.conf配置与高级数据类型 一、redis 服务器配置–redis.conf 配置 1、服务器端设定 1&#xff09;设置服务器以守护进程的方式运行&#xff1a; daemonize yes|no 2&#xff09;绑定主机地址&#xff1a; bin…

【防火墙】防火墙NAT、智能选路综合实验

实验拓扑 实验要求 7&#xff0c;办公区设备可以通过电信链路和移动链路上网(多对多的NAT&#xff0c;并且需要保留一个公网IP不能用来转换) 8&#xff0c;分公司设备可以通过总公司的移动链路和电信链路访问到Dmz区的http服务器 9&#xff0c;多出口环境基于带宽比例进行选路…

自动驾驶AVM环视算法–更新超广角视图算法和exe测试demo

1、测试环境 opencv310vs2022 2、使用的编程语言 c和c 3、测试的demo的获取 更新&#xff1a;测试的exe程序&#xff0c;无需解压码就可以体验算法测试效果 百度网盘&#xff1a; 链接&#xff1a;https://pan.baidu.com/s/1ndDcJ6VwexZoLUyUXlwLwg 提取码&#xff1a;q1…

python-爬虫实例(1):获取京东商品评论

目录 前言 道路千万条&#xff0c;安全第一条 爬虫不谨慎&#xff0c;亲人两行泪 获取京东商品评论信息 一、实例示范 二、爬虫四步走 1.UA伪装 2.获取Url 3.发送请求 4.获取响应数据进行解析并保存 总结 前言 道路千万条&#xff0c;安全第一条 爬虫不谨慎&#xff0c;…

手机怎么恢复回收站清空的照片?2个技巧大公开(适用各类安卓机)

站在时间的边缘&#xff0c;凝视着那些即将消逝的回忆&#xff0c;心里的惆怅不断增加。我们到底该怎么恢复回收站删除的照片呢&#xff1f;请相信&#xff0c;这些回忆并未真正消失。 无论你是因为误操作还是其他原因导致回收站被清空&#xff0c;这篇文章都将为你提供有力的…

Centos7_Minimal安装Cannot find a valid baseurl for repo: base/7/x86_6

问题 运行yum报此问题 就是没网 解决方法 修改网络信息配置文件&#xff0c;打开配置文件&#xff0c;输入命令&#xff1a; vi /etc/sysconfig/network-scripts/ifcfg-网卡名字把ONBOOTno&#xff0c;改为ONBOOTyes 重启网卡 /etc/init.d/network restart 网路通了

慎用Float和Double进行浮点运算

背景 在之前的开发过程中, 遇到了一些小问题. 就是在某功能计算时, 按照当时的设想是需要保留两位小数并向下取整. 当时没有太好的思路, 于是请教了好朋友gpt同志. 而gpt给出3种思路: 使用String.format方法 double value 123.456789; String formattedString String.forma…

Redis从入门到超神-(五)Redis实现分布式锁原理

引言 什么是分布式锁&#xff1f; 分布式锁是分布式系统中用于控制多个进程或线程对共享资源的访问的一种机制。在分布式系统中&#xff0c;由于存在多个服务实例或节点&#xff0c;它们可能会同时尝试访问或修改同一份数据或资源。如果没有适当的同步机制&#xff0c;就可能导…

labview实现两台电脑共享变量传输及同步

因为工作需要&#xff0c;需要实现多台主机间进行数据传输&#xff0c; 有两个备选方案&#xff0c; 1&#xff1a;建立tcp&#xff0c;然后自己解包 2&#xff1a;就是通过共享变量传输 虽然共享变量也是建立在TCP/IP上面的&#xff0c;但是不用自己解包呀 关于共享变量网络上…

mysql面试(四)

前言 本章节有些长&#xff0c;主要的篇幅是介绍缓存页的算法&#xff0c;如何快速的定位哪些是没有用过的&#xff0c;哪些是用过的&#xff0c;哪些是要淘汰掉的。 建议可以阅读一下这里面LRU算法相关的内容&#xff0c;和很多组件里面基本原理都是想通的&#xff0c;比如re…

聊聊 C# 中的顶级语句

前言 在 C# 9.0 版本之前&#xff0c;即使只编写一行输出 “Hello world” 的 C# 代码&#xff0c;也需要创建一个 C# 类&#xff0c;并且需要为这个 C# 类添加 Main 方法&#xff0c;才能在 Main 方法中编写代码。从 C# 9.0 开始&#xff0c;C# 增加了 “顶级语句” 语法&…

redis原理之底层数据结构-跳表

1.什么是跳表 1.1 链表及其不足 链表是在程序设计中最常见的数据结构之一&#xff0c;它通过指针将多个链表节点连接起来&#xff0c;这样就可以将逻辑上同一类的数据存储到不连续的内存空间上。链表结构如下&#xff1a; 但是链表有一个问题&#xff0c;就是当链表需要查询一…

3.1 FreeRTOS详细移植步骤(自己的实操)

[TOC](3.1 FreeRTOS详细移植步骤(自己的实操)) 自己使用阿波罗F767的内存管理实验和定时器实验&#xff0c;进行复刻。 FreeRTOS源码版本是FreeRTOS 202212.01。官网和Github都有下载。 按照STM32F767FreeRTOS开发手册V1.1进行移植复刻。 注:这个开发手册不是开发指南。跟视频里…

关于Qt部署CMake导致“Failed to set working directory to”的问题

2024年7月23日补充&#xff1a;该目录过深的情况只在Win10上有发现&#xff0c;Win11则没有问题&#xff0c;且Win11可以在DevHome中设置LongPath。 --------------------------------------------------------------------------------------------------------------- 使用qt…