前端开发之JavaScript常用基本数据类型方法小结

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档

文章目录


前言

JavaScript小结


1.数据类型

1.1基本数据类型

基本数据类型的值,直接保存在栈内存中。值与值之间是独立存在,修改一个变量不会影响其他的变量。基本数据类型string无法绑定属性和方法

var str = 'qianguyihao';

str.aaa = 12;
console.log(typeof str); //打印结果为:string
console.log(str.aaa); //打印结果为:undefined

1.2引用数据类型

对象是保存到堆内存中的。每创建一个新的对象,就会在堆内存中开辟出一个新的空间;而变量保存了对象的内存地址(对象的引用),保存在栈内存当中。如果两个变量保存了同一个对象的引用,当一个通过一个变量修改属性时,另一个也会受到影响。引用数据类型String是可以绑定属性和方法的。如下

var strObj = new String('smyhvae');
strObj.aaa = 123;
console.log(strObj);
console.log(typeof strObj); //打印结果:Object
console.log(strObj.aaa);

2.字符串的常用方法

2.1内置对象:就是指这个语言自带的一些对象,供开发者使用,这些对象提供了一些常用或者最基本而必要的功能(属性和方法)。

内置对象最大的优点就是帮助我们快速开发。

JavaScript的内置对象

内置对象对象说明
Arguments函数参数集合
Array数组
Boolean布尔对象
Math数学对象
Date日期时间
Error异常对象
Function函数构造器
Number数值对象
Object基础对象
RegExp正则表达式对象
String字符串对象

注意:字符串的所有方法,都不会改变原字符串(字符串的不可变性),操作完成后会返回一个新的值。

2.2查找字符串

indexOf()/lastIndexOf():获取字符串中指定内容的索引

语法1:

索引值 = str.indexOf(想要查询的字符串);

备注:indexOf() 是从前向后查找字符串的位置。同理,lastIndexOf()是从后向前寻找。

语法2:

索引值 = str.indexOf(想要查询的字符串, [起始位置]);

详细参考:字符串的常见方法


3.内置对象number和Math的常见用法

Math 和其他的对象不同,它不是一个构造函数,不需要创建对象。所以我们不需要 通过 new 来调用,而是直接使用里面的属性和方法即可。

Math属于一个工具类,里面封装了数学运算相关的属性和方法。如下

方法描述备注
Math.PI圆周率Math对象的属性
Math.abs()返回绝对值
Math.random()生成0-1之间的随机浮点数取值范围是 [0,1)
Math.floor()向下取整(往小取值)
Math.ceil()向上取整(往大取值)
Math.round()四舍五入取整(正数四舍五入,负数五舍六入)
Math.max(x, y, z)返回多个数中的最大值
Math.min(x, y, z)返回多个数中的最小值
Math.pow(x,y)乘方:返回 x 的 y 次幂
Math.sqrt()

开方:对一个数进行开方运算

详细参考: Number和Math的常见用法

4.内置对象Date

4.1创建Date对象

创建Date对象有两种写法:

  • 写法一:如果Date()不写参数,就返回当前时间对象

  • 写法二:如果Date()里面写参数,就返回括号里输入的时间对象

针对这两种写法,我们来具体讲一讲。

# 写法一:不传递参数时,则获取系统的当前时间对象

代码举例:

var date1 = new Date();
console.log(date1);
console.log(typeof date1);

代码解释:不传递参数时,表示的是获取系统的当前时间对象。也可以理解成是:获取当前代码执行的时间。

打印结果:

Mon Feb 17 2020 21:57:22 GMT+0800 (中国标准时间)
object

写法二:传递参数

传递参数时,表示获取指定时间的时间对象。参数中既可以传递字符串,也可以传递数字,也可以传递时间戳。

通过传参的这种写法,我们可以把时间字符串/时间数字/时间戳,按照指定的格式,转换为时间对象。

举例1:(参数是字符串)

const date11 = new Date('2020/02/17 21:00:00');
console.log(date11); // Mon Feb 17 2020 21:00:00 GMT+0800 (中国标准时间)

const date12 = new Date('2020/04/19'); // 返回的就是四月
console.log(date12); // Sun Apr 19 2020 00:00:00 GMT+0800 (中国标准时间)

const date13 = new Date('2020-05-20');
console.log(date13); // Wed May 20 2020 08:00:00 GMT+0800 (中国标准时间)

const date14 = new Date('Wed Jan 27 2017 12:00:00 GMT+0800 (中国标准时间)');
console.log(date14); // Fri Jan 27 2017 12:00:00 GMT+0800 (中国标准时间)

 举例3:(参数是时间戳)(什么是时间戳接着看)

const date31 = new Date(1591950413388);
console.log(date31); // Fri Jun 12 2020 16:26:53 GMT+0800 (中国标准时间)

// 先把时间对象转换成时间戳,然后把时间戳转换成时间对象
const timestamp = new Date().getTime();
const date32 = new Date(timestamp);
console.log(date32); // Fri Jun 12 2020 16:28:21 GMT+0800 (中国标准时间)

4.2日期的格式化

上一段内容里,我们获取到了 Date 对象,但这个对象,打印出来的结果并不是特别直观。

如果我们需要获取日期的指定部分,就需要用到 Date对象自带的方法。

获取了日期指定的部分之后,我们就可以让日期按照指定的格式,进行展示(即日期的格式化)。比如说,我期望能以 2020-02-02 19:30:59 这种格式进行展示。

在这之前,我们先来看看 Date 对象有哪些方法。

# Date对象的方法

Date对象 有如下方法,可以获取日期和时间的指定部分

方法名含义备注
getFullYear()获取年份
getMonth()获取月: 0-110代表一月
getDate()获取日:1-31获取的是几号
getDay()获取星期:0-60代表周日,1代表周一
getHours()获取小时:0-23
getMinutes()获取分钟:0-59
getSeconds()获取秒:0-59
getMilliseconds()获取毫秒1s = 1000ms

代码举例

// 我在执行这行代码时,当前时间为 2019年2月4日,周一,13:23:52
	var myDate = new Date();

	console.log(myDate); // 打印结果:Mon Feb 04 2019 13:23:52 GMT+0800 (中国标准时间)

	console.log(myDate.getFullYear()); // 打印结果:2019
	console.log(myDate.getMonth() + 1); // 打印结果:2
	console.log(myDate.getDate()); // 打印结果:4

	var dayArr  = ['星期日', '星期一', '星期二', '星期三', '星期四','星期五', '星期六'];
	console.log(myDate.getDay()); // 打印结果:1
	console.log(dayArr[myDate.getDay()]); // 打印结果:星期一

	console.log(myDate.getHours()); // 打印结果:13
	console.log(myDate.getMinutes()); // 打印结果:23
	console.log(myDate.getSeconds()); // 打印结果:52
	console.log(myDate.getMilliseconds()); // 打印结果:393

	console.log(myDate.getTime()); // 获取时间戳。打印结果:1549257832393

4.3获取时间戳

时间戳的定义和作用

时间戳:指的是从格林威治标准时间的1970年1月1日,0时0分0秒到当前日期所花费的毫秒数(1秒 = 1000毫秒)。

计算机底层在保存时间时,使用的都是时间戳。时间戳的存在,就是为了统一时间的单位。

我们经常会利用时间戳来计算时间,因为它更精确。而且,在实战开发中,接口返回给前端的日期数据,都是以时间戳的形式。

getTime():获取时间戳

getTime() 获取日期对象的时间戳(单位:毫秒)。这个方法在实战开发中,用得比较多。但还有比它更常用的写法,我们往下看。

我们来看看代码:

// 方式一:获取 Date 对象的时间戳(最常用的写法)
const timestamp1 = +new Date();
console.log(timestamp1); // 打印结果举例:1589448165370

// 方式二:获取 Date 对象的时间戳(较常用的写法)
const timestamp2 = new Date().getTime();
console.log(timestamp2); // 打印结果举例:1589448165370

// 方式三:获取 Date 对象的时间戳
const timestamp3 = new Date().valueOf();
console.log(timestamp3); // 打印结果举例:1589448165370

// 方式4:获取 Date 对象的时间戳
const timestamp4 = new Date() * 1;
console.log(timestamp4); // 打印结果举例:1589448165370

// 方式5:获取 Date 对象的时间戳
const timestamp5 = Number(new Date());
console.log(timestamp5); // 打印结果举例:1589448165370
// 方式六:获取当前时间的时间戳(很常用的写法)
console.log(Date.now()); // 打印结果举例:1589448165370

 format()

将时间对象转换为指定格式。

    var oldTime = (new Date("2012/12/25 20:11:11")).getTime();
    var curTime = new Date(oldTime).format("yyyy-MM-dd");
    console.log(curTime);

   运行如下:
    2012-12-25

  

详细参考:Data的详细指引

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值