JS-标准对象

最新推荐文章于 2021-07-12 10:51:58 发布
原创 最新推荐文章于 2021-07-12 10:51:58 发布 · 559 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文深入探讨了JavaScript中的标准对象，包括日期、正则表达式及JSON的使用技巧。详细讲解了Date对象的创建与操作，正则表达式的匹配与分组，以及JSON的序列化与反序列化过程。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

JS-标准对象

在JS世界里，一切都是对象。
可以用typeof操作符获取对象的类型，它总是返回一个字符串：

typeof 123; // 'number'
typeof NaN; // 'number'
typeof 'str'; // 'string'
typeof true; // 'boolean'
typeof undefined; // 'undefined'
typeof Math.abs; // 'function'
typeof null; // 'object'
typeof []; // 'object'
typeof {}; // 'object'

可见，number、string、boolean、undefined、object有别于其他类型。值得注意的是：null、Array、{}都属于object。

包装对象

JS还提供了包装对象，number、boolean、string都有包装对象，包装对象用new创建，但是类型已经变为object了：

var n = new Number(123); // 123,生成了新的包装类型
var b = new Boolean(true); // true,生成了新的包装类型
var s = new String('str'); // 'str',生成了新的包装类型
n === 123; // false
b === true; // false
s === 'str' // false

此外，Number()、Boolean()、String()会被当成普通函数，把任何类型转换为number、boolean和string类型。
总结有几条规则需要遵守：

  • 不要使用new Number()、new Boolean()、**new String()**创建包装对象；
  • 用parseInt()或parseFloat()来转换任意类型到number；
  • 通常不必把任意类型转换为boolean再判断，因为可以直接写if (myVar) {…}；
  • typeof操作符可以判断出number、boolean、string、function和undefined；
  • 判断Array要使用Array.isArray(arr)；
  • 判断null要使用myVar === null；
  • 判断某个全局变量是否存在使用typeod window.myVar === 'undefined'；
  • 判断函数内部某个变量是否存在使用typeof myVar === 'undefined'；

Date

获取当前时间：

var now = new Date();
now; // Wed Feb 06 2019 21:34:28 GMT+0800 (中国标准时间)
now.getFullYear(); // 2019，  年份
now.getMonth(); // 1,   月份。注意范围是0~11，1表示二月
now.getDay(); // 3， 表示星期三
now.getHours(); // 21, 二十四小时制
now.getMinutes(); // 34，分钟
now.getSeconds(); // 28， 秒
now.getMilliseconds(); // 682，毫秒数
now.getTime(); // 1549460068682， 以number形式表示的时间戳

注意：当前获取时间是浏览器从本机操作系统获取的时间，所以不一定准确。

  • 创建Date
    创建时间的两种方法：
  1. 以年、月、日、时、分、秒、毫秒为参数创建：
var d = new Date(2015, 5, 19, 20, 15, 30, 123);
d; // Fri Jun 19 2015 20:15:30 GMT+0800 (CST)
  1. 解析一个符合ISO 8601格式的字符串：
var d = Date.parse('2015-06-24T19:49:22.875+08:00');
d; // 1435146562875

但它返回的不是Date对象，而是一个时间戳,不过很容易转换成一个Date：

var d = new Date(1435146562875);
d; // Wed Jun 24 2015 19:49:22 GMT+0800 (CST)
d.getMonth(); // 5
  • 时区
    Date对象表示的时间总是按浏览器所在的时区显示的，不过我们既可以显示本地时间，也可以显示调整后的UTC时间：
var d = new Date(1435146562875);
d.toLocaleString(); // '2015/6/24 下午7:49:22'，本地时间（北京时区+8:00），显示的字符串与操作系统设定的格式有关
d.toUTCString(); // 'Wed, 24 Jun 2015 11:49:22 GMT'，UTC时间，与本地时间相差8小时

RegExp

正则表达式是一种匹配字符串的强有力的武器。

- 基础

  • \d可以匹配一个数字。
  • \w可以匹配一个数字或字母。
  • .可以匹配任意字符。
  • 特殊字符需要用\转义。
  • 要匹配变长的字符，在正则表达式中，用*表示任意个字符(包括0个)，用+表示至少一个字符，用?表示0或1个字符，用{n}表示n个字符，用{n,m}表示n-m个字符。

- 进阶

要更精确地匹配，可以用[]表示范围，比如：
- [0-9a-zA-Z_]可以匹配一个数字、字母或者下划线；
- [0-9a-zA-Z_]+可以匹配至少由一个数字、字母或者下划线组成的字符串，比如’a100’，‘0_Z’，'js2015’等等；
- [a-zA-Z_$][0-9a-zA-Z_$]*可以匹配由字母或下划线、开头，后接任意个由一个数字、字母或者下划线、开头，后接任意个由一个数字、字母或者下划线、开头，后接任意个由一个数字、字母或者下划线、组成的字符串，也就是JavaScript允许的变量名；
- [a-zA-Z_$][0-9a-zA-Z_$]{0, 19}更精确地限制了变量的长度是1-20个字符（前面1个字符+后面最多19个字符）。
- A|B可以匹配A或B。
- ^表示行的开头，$表示行的结束。比如：js也可以匹配'jsp'，但加上^js$就只能匹配'js'了。

- RegExp

在JS中创建正则表达式有两种方式：
第一种是通过/正则表达式/写出来，第二种是通过new RegExp('正则表达式')创建一个RegExp对象。

var re1 = /ABC\-001/;
var re2 = new RegExp('ABC\\-001');

re1; // /ABC\-001/
re2; // /ABC\-001/

注意：第二种创建方式因为字符串转义的问题，字符串的两个\\实际上是一个\。
RegExp对象的test()方法用于测试给定的字符串是否符合条件：

var re1 = /ABC\-001/;
var re2 = new RegExp('ABC\\-001');

re1; // /ABC\-001/
re2; // /ABC\-001/

- 切分字符串

用正则表达式切分字符串比用固定字符更灵活，正常的切分代码：

'a b   c'.split(' '); // ['a', 'b', '', '', 'c']

无法识别连续的空格，用正则表达式：

'a b   c'.split(/\s+/); // ['a', 'b', 'c']

加入,试试：

'a,b, c  d'.split(/[\s\,]+/); // ['a', 'b', 'c', 'd']

- 分组

正则表达式还是提取子串的功能。用()表示的是要提取的分组。

var re = /^(\d{3})-(\d{3,8})$/;
re.exec('010-12345'); // ['010-12345', '010', '12345']
re.exec('010 12345'); // null

定义了组，就可以在RegExp对象上用**exec()**方法提取出子串来。
exec()匹配成功后会返回一个字符串组,第一个元素是正则表达式匹配到的整个字符串，后面的子串表示匹配成功的子串。exec()匹配失败时会返回null。
提取子串很有用，比如：

var re = /^(0[0-9]|1[0-9]|2[0-3]|[0-9])\:(0[0-9]|1[0-9]|2[0-9]|3[0-9]|4[0-9]|5[0-9]|[0-9])\:(0[0-9]|1[0-9]|2[0-9]|3[0-9]|4[0-9]|5[0-9]|[0-9])$/;
re.exec('19:05:30'); // ['19:05:30', '19', '05', '30']

- 贪婪匹配

正则匹配默认是贪婪匹配，也就是匹配尽可能多的字符，比如：

var re = /^(\d+)(0*)$/;
re.exec('102300'); // ['102300', '102300', '']

由于\d+采用贪婪匹配，直接把后面的0全部匹配了，结果0*只能匹配空字符串了。
加个?就可以让\d+采用非贪婪匹配（也就是尽可能少匹配）

var re = /^(\d+?)(0*)$/;
re.exec('102300'); // ['102300', '1023', '00']

- 全局搜索

JS正则表达式还有几个特殊的标志，最常用的是g，表示全局匹配：

var r1 = /test/g;
// 等价于:
var r2 = new RegExp('test', 'g');

全局匹配可以多次执行exec()方法来搜索一个匹配的字符串。当我们指定g标志后，每次运行exec()，正则表达式本身会更新lastIndex属性，表示上次匹配到的最后索引：

var s = 'JavaScript, VBScript, JScript and ECMAScript';
var re=/[a-zA-Z]+Script/g;

// 使用全局匹配:
re.exec(s); // ['JavaScript']
re.lastIndex; // 10

re.exec(s); // ['VBScript']
re.lastIndex; // 20

re.exec(s); // ['JScript']
re.lastIndex; // 29

re.exec(s); // ['ECMAScript']
re.lastIndex; // 44

re.exec(s); // null，直到结束仍没有匹配到

全局匹配类似搜索，因此不能使用/^…$/，那样只会最多匹配一次。
正则表达式还可以指定i标志，表示忽略大小写，m标志，表示执行多行匹配。

JSON

JSON是JavaScript Object Notation的缩写，它是一种数据交换格式。
JSON实际上是JavaScript的一个子集。在JSON中，一共这么几个数据类型：

  • number：和JavaScript的number完全一致；

  • boolean：就是JavaScript的true或false；

  • string：就是JavaScript的string；

  • null：就是JavaScript的null；

  • array：就是JavaScript的Array表示方式——[]；

  • object：就是JavaScript的{ … }表示方式。
    以及上面的任意组合。
    并且，JSON还定死了字符集必须是UTF-8，表示多语言就没有问题了。为了统一解析，JSON的字符串规定必须用双引号""，Object的键也必须用双引号""。
    由于JSON非常简单，很快就风靡Web世界，并且成为ECMA标准。几乎所有编程语言都有解析JSON的库，而在JavaScript中，我们可以直接使用JSON，因为JavaScript内置了JSON的解析。

  • 序列化
    使用**JSON.string()**把任何JS对象序列化成一个JSON格式的字符串：

var xiaoming = {
    name: '小明',
    age: 14,
    gender: true,
    height: 1.65,
    grade: null,
    'middle-school': '\"W3C\" Middle School',
    skills: ['JavaScript', 'Java', 'Python', 'Lisp']
};
s; // {"name":"小明","age":14,"gender":true,"height":1.65,"grade":null,"middle-school":"\"W3C\" Middle School","skills":["JavaScript","Java","Python","Lisp"]}

输出的好看一点，加上参数，按缩进输出：

JSON.stringify(xiaoming, null, '  ');

结果：

{
  "name": "小明",
  "age": 14,
  "gender": true,
  "height": 1.65,
  "grade": null,
  "middle-school": "\"W3C\" Middle School",
  "skills": [
    "JavaScript",
    "Java",
    "Python",
    "Lisp"
  ]
}

第二个参数用于控制如何筛选对象的键值，如果只想输出指定的属性，可以穿入Array：

JSON.stringify(xiaoming, ['name', 'skills'], '  ');

结果：

{
  "name": "小明",
  "skills": [
    "JavaScript",
    "Java",
    "Python",
    "Lisp"
  ]
}

还可以传入一个函数，这样对象的每个键值对都会被函数先处理：

function convert(key, value) {
    if (typeof value === 'string') {
        return value.toUpperCase();
    }
    return value;
}

JSON.stringify(xiaoming, convert, '  ');

上面代码把所有属性值变为大写：

{
  "name": "小明",
  "age": 14,
  "gender": true,
  "height": 1.65,
  "grade": null,
  "middle-school": "\"W3C\" MIDDLE SCHOOL",
  "skills": [
    "JAVASCRIPT",
    "JAVA",
    "PYTHON",
    "LISP"
  ]
}

JSON

阅读: 102315
JSON是JavaScript Object Notation的缩写，它是一种数据交换格式。

在JSON出现之前，大家一直用XML来传递数据。因为XML是一种纯文本格式，所以它适合在网络上交换数据。XML本身不算复杂，但是，加上DTD、XSD、XPath、XSLT等一大堆复杂的规范以后，任何正常的软件开发人员碰到XML都会感觉头大了，最后大家发现，即使你努力钻研几个月，也未必搞得清楚XML的规范。

终于，在2002年的一天，道格拉斯·克罗克福特（Douglas Crockford）同学为了拯救深陷水深火热同时又被某几个巨型软件企业长期愚弄的软件工程师，发明了JSON这种超轻量级的数据交换格式。

道格拉斯同学长期担任雅虎的高级架构师，自然钟情于JavaScript。他设计的JSON实际上是JavaScript的一个子集。在JSON中，一共就这么几种数据类型：

number：和JavaScript的number完全一致；
boolean：就是JavaScript的true或false；
string：就是JavaScript的string；
null：就是JavaScript的null；
array：就是JavaScript的Array表示方式——[]；
object：就是JavaScript的{ … }表示方式。
以及上面的任意组合。

并且，JSON还定死了字符集必须是UTF-8，表示多语言就没有问题了。为了统一解析，JSON的字符串规定必须用双引号""，Object的键也必须用双引号""。

由于JSON非常简单，很快就风靡Web世界，并且成为ECMA标准。几乎所有编程语言都有解析JSON的库，而在JavaScript中，我们可以直接使用JSON，因为JavaScript内置了JSON的解析。

把任何JavaScript对象变成JSON，就是把这个对象序列化成一个JSON格式的字符串，这样才能够通过网络传递给其他计算机。

如果我们收到一个JSON格式的字符串，只需要把它反序列化成一个JavaScript对象，就可以在JavaScript中直接使用这个对象了。

- 序列化

让我们先把小明这个对象序列化成JSON格式的字符串：

‘use strict’;

var xiaoming = {
name: ‘小明’,
age: 14,
gender: true,
height: 1.65,
grade: null,
‘middle-school’: ‘“W3C” Middle School’,
skills: [‘JavaScript’, ‘Java’, ‘Python’, ‘Lisp’]
};

var s = JSON.stringify(xiaoming);
console.log(s);

Run
{“name”:“小明”,“age”:14,“gender”:true,“height”:1.65,“grade”:null,“middle-school”:"“W3C” Middle School",“skills”:[“JavaScript”,“Java”,“Python”,“Lisp”]}
要输出得好看一些，可以加上参数，按缩进输出：

JSON.stringify(xiaoming, null, ’ ');
结果：

{
“name”: “小明”,
“age”: 14,
“gender”: true,
“height”: 1.65,
“grade”: null,
“middle-school”: ““W3C” Middle School”,
“skills”: [
“JavaScript”,
“Java”,
“Python”,
“Lisp”
]
}
第二个参数用于控制如何筛选对象的键值，如果我们只想输出指定的属性，可以传入Array：

JSON.stringify(xiaoming, [‘name’, ‘skills’], ’ ');
结果：

{
“name”: “小明”,
“skills”: [
“JavaScript”,
“Java”,
“Python”,
“Lisp”
]
}
还可以传入一个函数，这样对象的每个键值对都会被函数先处理：

function convert(key, value) {
if (typeof value === ‘string’) {
return value.toUpperCase();
}
return value;
}

JSON.stringify(xiaoming, convert, ’ ');
上面的代码把所有属性值都变成大写：

{
“name”: “小明”,
“age”: 14,
“gender”: true,
“height”: 1.65,
“grade”: null,
“middle-school”: ““W3C” MIDDLE SCHOOL”,
“skills”: [
“JAVASCRIPT”,
“JAVA”,
“PYTHON”,
“LISP”
]
}
如果我们还想要精确控制如何序列化小明，可以给xiaoming定义一个**toJSON()**的方法，直接返回JSON应该序列化的数据：

var xiaoming = {
    name: '小明',
    age: 14,
    gender: true,
    height: 1.65,
    grade: null,
    'middle-school': '\"W3C\" Middle School',
    skills: ['JavaScript', 'Java', 'Python', 'Lisp'],
    toJSON: function () {
        return { // 只输出name和age，并且改变了key：
            'Name': this.name,
            'Age': this.age
        };
    }
};

JSON.stringify(xiaoming); // '{"Name":"小明","Age":14}'

- 反序列化

使用**JSON.parse()**反序列化JSON格式字符串为JS对象：

JSON.parse('[1,2,3,true]'); // [1, 2, 3, true]
JSON.parse('{"name":"小明","age":14}'); // Object {name: '小明', age: 14}
JSON.parse('true'); // true
JSON.parse('123.45'); // 123.45
SherrybabyOne
关注
JavaScript-Object对象详解
主营前端方向，技术栈是vue
11-29 2755
Object对象(对象说明，对象属性的增删改查，属性和属性名的命名标准，in运算符检查一个对象中个是否含有指定的属性，对象字面量)
javascript标准库(js的标准内置对象)总结
10-18
JavaScript标准库是JavaScript语言的核心组成部分，它包含了JavaScript在全局范围内的预定义对象、函数和属性，这些内容在编程时可以直接使用，无需额外导入。本文将深入探讨JavaScript标准库中的关键知识点。 首先...
JavaScript基础系列之三 标准对象
胡杰的专栏
08-23 1069
JavaScript基础系列之三 标准对象 标准对象 Date RegExp JSON
JS学习-标准对象
MayerF的专栏
08-14 436
再JS世界里，一切皆对象。 为了区分对象的类型，JS中使用typeof操作符来获取对象类型，且返回字符串：typeof 123; // 'number' typeof NaN; // 'number' typeof 'str'; // 'string' typeof true; // 'boolean' typeof undefined; // 'undefined' typeof Math.ab
廖雪峰js教程笔记7 基本类型和包装类型
weixin_30826095的博客
10-26 139
在JavaScript的世界里，一切都是对象。 但是某些对象还是和其他对象不太一样。为了区分对象的类型，我们用typeof操作符获取对象的类型，它总是返回一个字符串： typeof 123; // 'number' typeof NaN; // 'number' typeof 'str'; // 'string' typeof true; // 'boolean' typeof und...
JSON
weixin_30616969的博客
12-01 144
一、简介 JSON是JavaScript Object Notation的缩写，它是一种数据交换格式。 在JSON出现之前，大家一直用XML来传递数据。因为XML是一种纯文本格式，所以它适合在网络上交换数据。XML本身不算复杂，但是，加上DTD、XSD、XPath、XSLT等一大堆复杂的规范以后，任何正常的软件开发人员碰到XML都会感觉头大了，最后大家发现，即使你努力钻研几个月，也未必搞得清楚...
「标准」的 JS风格
weixin_34007886的博客
10-31 237
首先，这份 JS风格指南已经在我司的前端团队实行半年多了； 其次，在程序员的世界里，从入行到资深都需要面对几个世界级的难题，如： 世界上最好的编辑器是什么？ 是用空格还是 TAB？用空格还特么衍生出 2空格 VS 4空格。 JS到底要不要写分号？ ... 最后，PHP是世界上最好的语言。 一、规范VS自由 对程序员的每个个体来说，有代码规范其实不一定是好事，因为肯定会影响到写码的自由。 比...
第三章javascript-DOM对象模型-补充课件(1).ppt
最新发布
07-22
### JavaScript-DOM对象模型知识点总结 #### 1. DOM模型概念解析 DOM（Document Object Model，文档对象模型）是一种编程接口，它将网页文档呈现为树形结构，通过它开发者可以访问和动态修改文档的内容、结构以及...
atom-standardjs-snippets：Atom，标准样式JavaScript代码段的集合
01-30
《Atom中的标准样式JavaScript代码段集合：atom-standardjs-snippets》 在编程世界里，高效编码是提升开发速度的关键。Atom是一款广受欢迎的开源文本编辑器，它支持大量的插件和扩展，使得开发者可以根据个人需求...
JavaScript-Canvas-to-Blob:JavaScript Canvas to Blob是将画布元素转换为Blob对象的功能
04-13
画布斑点是一种对于不支持标准JavaScript的浏览器方法。 它可以用于从HTML 元素创建对象。 设置 通过NPM安装： npm install blueimp-canvas-to-blob 这会将JavaScript文件相对于当前目录安装在./node_modules/...
JavaScript标准对象
ti_an_1989的专栏
03-06 217
标准对象 typeof判断类型 返回值是一个字符串。 typeof 123; // 'number' typeof NaN; // 'number' typeof 'str'; // 'string' typeof true; // 'boolean' typeof undefined; // 'undefined' typeof Math.abs; // 'function' typeof nu...
JS 标准库对象
cqqorcq的博客
07-19 535
第9章 标准库对象(内置对象) js学习中的三种对象: 内置对象 自定义对象 浏览器对象 JavaScript 提供了很多个内置对象：Math/Array/Number/String/Boolean... 对象只是带有属性和方法的特殊数据类型。 我们在学习时其实就是要记住对象的每个属性和方法怎么使用，代表什么含义； 技术问题，遇到分歧，去哪里查找资料： 9....
js标准对象
weixin_30832983的博客
10-22 96
在JavaScript的世界里，一切都是对象。 但是某些对象还是和其他对象不太一样。为了区分对象的类型，我们用typeof操作符获取对象的类型，它总是返回一个字符串： typeof 123; //'number' typeof NaN;//'number' typeof 'str';//'string' typeof t...
JavaScript--标准对象(Date日期对象 & Json对象)
天行健 君子以自强不息，地势坤 君子以厚德载物。
07-12 1036
1. 标准对象 1.1 标准对象 在JavaScript的世界里，一切都是对象。 1.2 常用标准对象 1.2.1 Date 在JavaScript中， Date 对象用来表示日期和时间。 注意，当前时间是浏览器从本机操作系统获取的时间，所以不一定准确，因为用户可以把当前时间设定为任何值。 时区 1.2.2 Json Json优点 JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式，目前使用特别广泛。 采用完全独立于
JavaScript中的标准对象
朝屯暮蒙vi的博客
09-04 355
JavaScript中的标准对象 JavaScript中对象类型主要有以下几种：                 number,string,Boolean,function,undefined,object； Number()、Boolean和String()作为函数，把任何类型的数据转换为number、boolean和string类型；还可以调用对象的toString方法把其他类型转
标准对象
chi1130的博客
05-10 472
typeof 123; // ‘number’ typeof NaN; // ‘number’ typeof ‘str’; // ‘string’ typeof true; // ‘boolean’ typeof undefined; // ‘undefined’ typeof Math.abs; // ‘function’ typeof null; // ‘object’ typeo
JavaScript的标准对象
Ccc1929969359的博客
06-28 205
    JavaScript——面向对象，运行在浏览器中的解释性变成语言。使用typeof方法区分对象的类型。特别注意‘null’和‘array’的类型都为Object。1.包装对象    类似Java中的int和Integer的包装关系。在JavaScript中number、string、boolean都有包装对象，包装对象用new创建。var n = new Number(number); v...
掌握JavaScript中的js-coin-object对象
标题“js-coin-object”和描述“js-coin-object”表明这个文件或项目与JavaScript编程语言中的一个对象或库有关，该对象或库被命名为“coin”，很可能用于与数字货币相关的操作，如模拟、管理、追踪和展示数字资产等...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值