ate
●Date 是 js 的一个内置对象，也叫内置构造函数。提供了一堆的方法帮助我们更方便的操作 时间

创建时间对象：new Date()
获取时间对象
●new Date() 在不传递参数的情况下是默认返回当前时间
○当前终端的时间信息
○注意: 和你终端设置的时区有关系

var time=new Date()
console.log(time) // 当前时间 Thu Sep 30 2021 11:05:10 GMT+0800 (中国标准时间)

●new Date() 在传入参数的时候，可以获取到一个你传递进去的时间

var time=new Date('2019-03-03 13:11:11')
console.log(time) // Sun Mar 03 2019 13:11:11 GMT+0800 (中国标准时间)

创建一个指定时间的时间对象
●可以通过两种方式来创建一个时间对象传递数字和传递字符串

传递数字
●new Date() 传递的参数有多种情况
○至少传递两个数字, 一个不好使
○传递一个代表的是一个毫秒数 指的是格林威治时间到你传递的毫秒数
■格林威治时间 : 1970 年 1 月 1 日 0 时 0 分 0 秒
○每一个数字都会自动进位

1.传递两个数字，第一个表示年，第二个表示月份
●第二个参数是表示月份的，但是这里需要注意这里的1月分是从0开始，也就是说0就表示1月分，11表示12月份

var time=new Date(2021, 09) // 月份从 0 开始计数，0 表示 1月，11 表示 12月
console.log(time) // Fri Oct 01 2021 00:00:00 GMT+0800 (中国标准时间)
    //之传入一个数字的情况
    //得到的是 从格林威治时间向后推进 2021ms
    // 格林威治时间: 1970 年 1 月 1 日 0 点 0 分 0 秒
var time1=new Date(2021)
console.log(time1) // Thu Jan 01 1970 08:00:02 GMT+0800 (中国标准时间)

2.传递三个数字，前两个不变，第三个表示该月份的第几天，从 1 到 31

var time=new Date(2019, 00, 05) 
console.log(time) // Sat Jan 05 2019 00:00:00 GMT+0800 (中国标准时间)

3.传递四个数字，前三个不变，第四个表示当天的几点，从 0 到 23

var time=new Date(2019, 00, 05, 22) 
console.log(time) // Sat Jan 05 2019 22:00:00 GMT+0800 (中国标准时间)

4.传递五个数字，前四个不变，第五个表示的是该小时的多少分钟，从 0 到 59

var time=new Date(2019, 00, 05, 22, 33) 
console.log(time) // Sat Jan 05 2019 22:33:00 GMT+0800 (中国标准时间)

5.传递六个数字，前五个不变，第六个表示该分钟的多少秒，从 0 到 59

var time=new Date(2019, 00, 05, 22, 33, 55) 
console.log(time) // Sat Jan 05 2019 22:33:55 GMT+0800 (中国标准时间)

传递字符串
●传入字符串的形式
○注意：当你传递字符串的时候, 1 表示 1 月, 12 表示 12 月
○年月日 和 时分秒之间一定要有一个空格

//传递参数形式一
console.log(new Date('2019'))
// Tue Jan 01 2019 08:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2019-02'))
// Fri Feb 01 2019 08:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2019-02-03'))
// Sun Feb 03 2019 08:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2019-02-03 13:'))
// Sun Feb 03 2019 13:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2019-02-03 13:13:'))
// Sun Feb 03 2019 13:13:00 GMT+0800 (中国标准时间)
console.log(new Date('2019-02-03 13:13:13'))
// Sun Feb 03 2019 13:13:13 GMT+0800 (中国标准时间)

//传递参数形式二
console.log(new Date('2019'))
// Tue Jan 01 2019 08:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2019/02'))
// Fri Feb 01 2019 08:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2019/02/03'))
// Sun Feb 03 2019 08:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2019/02/03 13:'))
// Sun Feb 03 2019 13:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2019/02/03 13:13:'))
// Sun Feb 03 2019 13:13:00 GMT+0800 (中国标准时间)
console.log(new Date('2019/02/03 13:13:13'))
// Sun Feb 03 2019 13:13:13 GMT+0800 (中国标准时间)

时间对象常用方法—获取
获取年 getFullYear
●作用：该方法是获取年份的
●语法：时间对象.getFullYear()
●返回值：该时间对象内的年份信息
○该方式是得到指定字符串中的年份信息

var time=new Date()
console.log(time.getFullYear()) // 2021

获取月 getMonth
●作用：getMonth() 方法是得到指定字符串中的哪一个月份
●语法：时间对象.getMonth()
●返回值：该时间对象内的月份信息
○注意：0 表示 1 月份, 11 表示 12 月份

var time1=new Date(2021, 11, 21, 10, 12, 15)
console.log(time1); //Tue Dec 21 2021 10:12:15 GMT+0800 (中国标准时间)
console.log(time1.getMonth()); // 11

获取天 getDate

●作用：getDate() 方法是得到指定字符串中的哪一天
●语法：时间对象.getDate()
●返回值：该时间对象内的日期信息

var time=new Date(2019, 03, 03, 08, 00, 22)
console.log(time.getDate()) // 3

获取小时 getHours
●作用：getHours() 方法是得到指定字符串中的哪小时
●语法：时间对象.getHours()
●返回值：该时间对象内的小时信息
○获取到的是 24 小时制的小时时间

var time=new Date(2019, 03, 03, 08, 00, 22)
console.log(time.getHours()) // 8

获取分钟 getMinutes
●作用：getMinutes() 方法是得到指定字符串中的哪分钟
●语法：时间对象.getMinutes()
●返回值：该时间对象内的分钟信息

var time=new Date(2019, 03, 03, 08, 00, 22)
console.log(time.getMinutes()) // 0

获取秒 getSeconds
●作用：getSeconds() 方法是得到指定字符串中的哪秒钟
●语法：时间对象.getSeconds()
●返回值：该时间对象内的秒钟信息

var time=new Date(2019, 03, 03, 08, 00, 22)
console.log(time.getSeconds()) // 22

获取毫秒 getMilliSeconds
●作用：getMilliSeconds()方法的等到毫秒
●语法：时间对象.getMilliSeconds()
●返回值：该时间对象内的毫秒信息
○毫秒是0--999。也就说秒和毫秒之间是1000进制

var time=new Date()
console.log(time.getMilliseconds()) 

获取周几 getDay
●作用：getDay() 方法是得到指定字符串当前日期是一周中的第几天（周日是 0，周六是 6）
●语法：时间对象.gerDay()
●返回值：该时间对象是一周中的第几天, 也就是周几

var time=new Date(2019, 03, 08, 08, 00, 22)
console.log(time.getDay()) // 1

获取时间戳 getTime
●作用：getTime() 方法是得到执行时间到 格林威治时间 的毫秒数
●语法：时间对象.getTime()
●返回值：格林威治时间到现在的毫秒数

、制作网页动画(了解)

本章目标

• 会使用transform 2D变形设置网页元素样式
• 会使用transition制作过渡动画
• 会使用animation制作网页动画

如何在网页中实现动画效果？

1. 动态图片
2. Flash
3. JavaScript

Flash需要插件支持，文件体积大 从这次课开始学习使用CSS代码来完成动画：存在兼容性问题

• CSS3变形
• CSS3过渡
• CSS3动画

6.1、CSS变形

• CSS3变形是一些效果的集合
• 如平移、旋转、缩放、倾斜效果
• 简言之，平移就是一个变形，旋转就是一个变形。。。

• 每个效果都可以称为变形（transform），它们可以分别操控元素发生平移、旋转、缩放、倾斜等变化

在这里插入图片描述

习强大的JavaScript一行代码，能够节省你的时间和代码量。

1. 将内容复制到剪贴板

为了提高网站的用户体验，我们经常需要将内容复制到剪贴板，以便用户可以将其粘贴到指定位置。

const copyToClipboard=(content)=> navigator.clipboard.writeText(content)
copyToClipboard("Hello fatfish")

2. 获取鼠标选中内容

你以前遇到过这种情况吗？我们需要获取用户选择的内容。

const getSelectedText=()=> window.getSelection().toString()
getSelectedText()

3. 打乱一个数组

打乱一个数组？这在彩票程序中非常常见，但它并不是真正的随机。

const shuffleArray=array=> array.sort(()=> Math.random() - 0.5)
shuffleArray([ 1, 2,3,4, -1, 0 ]) // [3, 1, 0, 2, 4, -1]

4.将rgba转换为十六进制

我们可以将rgba和十六进制颜色值互相转换。

const rgbaToHex=(r, g, b)=> "#" + [r, g, b].map(num=> parseInt(num).toString(16).padStart(2, '0')).join('')
rgbaToHex(0, 0 ,0) // #000000
rgbaToHex(255, 0, 127) //#ff007f

5.将十六进制转换为rgba

const hexToRgba=hex=> {
  const [r, g, b]=hex.match(/\w\w/g).map(val=> parseInt(val, 16))
  return `rgba(${r}, ${g}, ${b}, 1)`;
}
hexToRgba('#000000') // rgba(0, 0, 0, 1)
hexToRgba('#ff007f') // rgba(255, 0, 127, 1)

6.获取多个数字的平均值

使用reduce函数，我们可以非常方便地得到一组数组的平均值。

const average=(...args)=> args.reduce((a, b)=> a + b, 0) / args.length
average(0, 1, 2, -1, 9, 10) // 3.5

7.检查一个数字是偶数还是奇数

怎么判断一个数字是奇数还是偶数？

const isEven=num=> num % 2===0
isEven(2) // true
isEven(1) // false

8.在数组中去重元素

使用Set来删除数组中的重复元素，会让这个过程变得非常简单。

const uniqueArray=(arr)=> [...new Set(arr)]
uniqueArray([ 1, 1, 2, 3, 4, 5, -1, 0 ]) // [1, 2, 3, 4, 5, -1, 0]

9.检查一个对象是否为空对象

const isEmpty=obj=> Reflect.ownKeys(obj).length===0 && obj.constructor===Object
isEmpty({}) // true
isEmpty({ name: 'fatfish' }) // false

10.反转字符串

const reverseStr=str=> str.split('').reverse().join('')
reverseStr('fatfish') // hsiftaf

11.计算两个日期之间的间隔

const dayDiff=(d1, d2)=> Math.ceil(Math.abs(d1.getTime() - d2.getTime()) / 86400000)
dayDiff(new Date("2023-06-23"), new Date("1997-05-31")) // 9519

12. 找出日期所在的年份中的天数

const dayInYear=(d)=> Math.floor((d - new Date(d.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24)
dayInYear(new Date('2023/06/23'))// 174

13.将字符串的首字母大写

const capitalize=str=> str.charAt(0).toUpperCase() + str.slice(1)
capitalize("hello fatfish")  // Hello fatfish

14.生成指定长度的随机字符串

const generateRandomString=length=> [...Array(length)].map(()=> Math.random().toString(36)[2]).join('')
generateRandomString(12) // cysw0gfljoyx
generateRandomString(12) // uoqaugnm8r4s

15.在两个整数之间获取一个随机整数

const random=(min, max)=> Math.floor(Math.random() * (max - min + 1) + min)
random(1, 100) // 27
random(1, 100) // 84
random(1, 100) // 55

16.指定位数四舍五入

const round=(n, d)=> Number(Math.round(n + "e" + d) + "e-" + d)
round(3.1415926, 3) //3.142
round(3.1415926, 1) //3.1

17.清除所有的cookies

const clearCookies=document.cookie.split(';').forEach(cookie=> document.cookie=cookie.replace(/^ +/, '').replace(/=.*/, `=;expires=${new Date(0).toUTCString()};path=/`))

18.检测是否为暗黑模式

const isDarkMode=window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
console.log(isDarkMode)

19.滚动到页面顶部

const goToTop=()=> window.scrollTo(0, 0)
goToTop()

20.判断是否为苹果设备

const isAppleDevice=()=> /Mac|iPod|iPhone|iPad/.test(navigator.platform)
isAppleDevice()

21.随机布尔值

const randomBoolean=()=> Math.random() >=0.5
randomBoolean()

22.获取变量的类型

const typeOf=(obj)=> Object.prototype.toString.call(obj).slice(8, -1).toLowerCase()
typeOf('')     // string
typeOf(0)      // number
typeOf()       // undefined
typeOf(null)   // null
typeOf({})     // object
typeOf([])     // array
typeOf(0)      // number
typeOf(()=> {})  // function

23.判断当前选项卡是否处于活动状态

const checkTabInView=()=> !document.hidden

24.检查元素是否处于焦点状态

const isFocus=(ele)=> ele===document.activeElement

25. 随机IP

const generateRandomIP=()=> {
  return Array.from({length: 4}, ()=> Math.floor(Math.random() * 256)).join('.');
}
generateRandomIP() // 220.187.184.113
generateRandomIP() // 254.24.179.151

总结

JavaScript一行代码是节省时间和代码的强大方式。它们可以用来在一行代码中执行复杂的任务，这对其他开发人员来说非常令人印象深刻。

在本文中，我们向您展示了25个厉害的JavaScript一行代码，这些代码将让您看起来像个专家。我们还提供了一些关于如何编写自己的JavaScript一行代码的技巧。

希望你喜欢这篇文章并且觉得它有帮助。如果你有任何问题，请随时在下方留言。