web学习笔记(十五)

目录

1.Date对象

1.1日期对象的概念

1.2Date()方法的使用

 1.3Date()常用方法汇总

1.4例题:用函数编写一个倒计时

2.函数

2.1函数的概念

2.2函数的使用

2.3函数的参数

2.4函数的声明 

 2.5函数的返回值

2.6异步函数

3特殊函数类型

3.1匿名函数

3.2箭头函数 

3.3 函数形参和实参个数不匹配问题

3.4break ,continue ,return 的区别


1.Date对象

1.1日期对象的概念

  • Date对象和Math对象不一样,他是一个构造函数,所以我们需要实例化后才能使用
  • Date实例用来处理日期和时间。

1.2Date()方法的使用

       格式:let now = new Date();

                  console.log(now);

  • 当Date()没有参数时,默认返回当前的时间。
  • 当Date()里面写参数时,就返回括号内输入的时间,此处的参数可以有多种格式,  eg:'2024-1-11 12:00:00'   '2024 1 11 12:00:00'    '2024/1/11 12:00:00'

 1.3Date()常用方法汇总

1.4例题:用函数编写一个倒计时

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>#div {width: 800px;height: 100px;margin: 200px auto;background-color: black;color: #fff;font-size: 30px;text-align: center;line-height: 100px;border-radius: 20px;}</style>
</head><body><div id="div"> </div><script>function countdown() {var targetDate = new Date("2024-01-15 12:00:00");var currentDate = new Date();var timeDiff = targetDate.getTime() - currentDate.getTime();var days = Math.floor(timeDiff / (1000 * 60 * 60 * 24));var hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));var minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / (1000 * 60));var seconds = Math.floor((timeDiff % (1000 * 60)) / 1000);let time = `距离2024-01-15 12:00:00还有:${days}天${ hours}时${minutes}分${seconds}秒 `;document.querySelector('#div').innerHTML = time;}countdown()setInterval(function () {countdown()}, 1000);</script>
</body></html>

效果: 

2.函数

2.1函数的概念

        函数就是封装了一段可被重复调用执行的代码块。通过此代码块可以实现大量代码的重复使用。函数对任何语言来说都是一个核心的概念,通过函数可以封装任意多条语句,而且可以在任何地方,任何时候调用执行。

2.2函数的使用

(1)声明函数:    function 函数名(){

                                             代码块

                                         }

(2)调用函数:  函数名()

  可以多次对函数进行调用,调用位置不限,前调和后调都可以。

2.3函数的参数

(1)形参:声明函数的参数叫形参,是局部变量,在函数之外是不起作用的(形参的个数和类型没有限制,多个参数之间以逗号隔开)

(2)实参:   调用函数时传的参数叫做实参

(3)补充: 

  •  在JavaScript中,形参的默认值是undefined。
  • 函数分为三种:有参、无参和带返回值。
  • 函数可以带参数,也可以不带参数,不带参数的函数叫做无参函数。

2.4函数的声明 

  •  可以包含数字 字母  _   $
  •  不能以数字开头
  •   区分大小写
  •   推荐用驼峰命名法,或者下划线命名法 eg:stuName  StuName
  •   见名知意,实在不知道怎么表达时可以用demo
  •   不能使用关键字和保留字
  •    尽量使用动词

 2.5函数的返回值

函数都是有返回值的,如果有return 则返回 return 后面的值,如果没有return 则返回 undefined。

return有两个作用:

  1.   返回表达式的结果。
  2.   结束函数(如果函数里面嵌套了循环,那循环也会跟着一块结束)
  3.   函数中有retrun表达式,函数调用时才可以用变量接受,或直接输入函数调用。

2.6异步函数

函数可以调用另外一个函数,因为每个函数都是独立的代码块,用于完成特殊任务,因此经常会用到函数相互调用的情况。

function fn1() { console.log(111); fn2(); console.log('fn1');
}
function fn2() {console.log(222); console.log('fn2');
}
fn1();

3特殊函数类型

3.1匿名函数

// 这是函数表达式写法,匿名函数后面跟分号结束
var fn = function(){...};
// 调用的方式,函数调用必须写到函数体下面
fn();
  • 因为函数没有名字,所以也被称为匿名函数
  • 这个fn 里面存储的是一个函数
  • 函数表达式方式原理跟声明变量方式是一致的
  • 函数调用的代码必须写到函数体后面,必须先声明,后调用
  • 和普通函数一样分为有参、无参和带返回值。

3.2箭头函数 

  let show=()=>{// 函数体console.log('111');}
  1.  () 如果括号里面的参数只有一个的话,括号可以省略。
  2.  {} 花括号中只有一句代码的时候,花括号可以省略
  3.   如果花括号中是一句返回值,return也必须省略。

3.3 函数形参和实参个数不匹配问题

参数个数说明
实参个数等于形参个数输出正确结果
实参个数多与形参个数只取到形参的个数
实参个数小于形参个数多的形参定义为undefined,结果为NaN

3.4break ,continue ,return 的区别

  • break :结束当前的循环体(如 for、while)
  • continue :跳出本次循环,继续执行下次循环(如 for、while)
  • return :不仅可以退出循环,还能够返回 return 语句中的值,同时还可以结束当前的函数体内的代码

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

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

相关文章

[Flutter] extends、implements、mixin和 abstract、extension的使用介绍说明

类创建&#xff1a;abstract&#xff08;抽象类&#xff09;、extension&#xff08;扩展&#xff09; 1.abstract&#xff08;抽象类&#xff09; dart 抽象类主要用于定义标准&#xff0c;子类可以继承抽象类&#xff0c;也可以实现抽象类接口。抽象类通过abstract 关键字来…

【软件测试】学习笔记-静态测试方法

这篇文章详细讨论人工静态测试方法和自动静态测试方法&#xff0c;来帮你理解研发流程上是如何保证代码质量的&#xff0c;以及如何搭建自己的自动静态代码扫描方案&#xff0c;并且应用到项目的日常开发工作中去。 人工静态方法本质上属于流程上的实践&#xff0c;实际能够发…

QEMU源码全解析 —— PCI设备模拟(7)

接前一篇文章&#xff1a; 上一回讲解了pci_edu_realize函数中的pci_register_bar函数&#xff0c;本回开始对于edu设备的MMIO读写函数进行解析。 操作系统与PCI设备交互的主要方式是PIO和MMIO。MMIO虽然是一段内存&#xff0c;但是其没有EPT映射&#xff0c;在虚拟机访问设备…

Smallpdf扫描、转换、压缩、编辑、签名PDF

【应用名称】&#xff1a;Smallpdf: 扫描、转换、压缩、编辑、签名PDF 【适用平台】&#xff1a;#Android 【软件标签】&#xff1a;#Smallpdf 【应用版本】&#xff1a;1.71.0 【应用大小】&#xff1a;150MB 【软件说明】&#xff1a;通过 Smallpdf&#xff0c;您可以&…

数据结构 模拟实现二叉树(孩子表示法)

目录 一、二叉树的简单概念 &#xff08;1&#xff09;关于树的一些概念 &#xff08;2&#xff09;二叉树的一些概念及性质 定义二叉树的代码&#xff1a; 二、二叉树的方法实现 &#xff08;1&#xff09;createTree &#xff08;2&#xff09;preOrder &#xff08;…

资源三号03星-立体测绘卫星星座

资源三号03星作为我国民用高分辨率立体测图卫星资源三号系列的第三颗卫星&#xff0c;在资源三号02星技术状态的基础上进行了继承和适当优化&#xff0c;设计寿命由资源三号02星的5年延长至8年&#xff0c;星上搭载了三线阵立体测绘相机、多光谱相机和业务化应用的激光测高仪&a…

【模型评估 07】过拟合与欠拟合

在模型评估与调整的过程中&#xff0c;我们往往会遇到“过拟合”或“欠拟合”的情况。如何有效地识别“过拟合”和“欠拟合”现象&#xff0c;并有针对性地进行模型调整&#xff0c;是不断改进机器学习模型的关键。特别是在实际项目中&#xff0c;采用多种方法、从多个角度降低…

C#使用CryptoStream类加密和解密字符串

目录 一、CrytoStream的加密方法 二、CrytoStream的解密方法 三、实例 1.源码Form1.cs 2.类库Encrypt.cs 3.生成效果 在使用CryptoStream前要先引用命名空间using System.Security.Cryptography。 一、CrytoStream的加密方法 记住&#xff0c;不能再使用DESCryptoServi…

DrGraph原理示教 - OpenCV 4 功能 - 边界填充

今天简单来看一下OpenCV中的边界填充 param src Source image. param dst Destination image of the same type as src and the size Size(src.colsleftright, src.rowstopbottom) . param top the top pixels param bottom the bottom pixels param left the left pixels par…

Photoshop 2024 (PS2024) v25 直装版 支持win/mac版

Photoshop 2024 提供了多种创意工具&#xff0c;如画笔、铅笔、涂鸦和渐变等&#xff0c;用户可以通过这些工具来创建独特和令人印象深刻的设计效果。增强的云同步&#xff1a;通过 Adobe Creative Cloud&#xff0c;用户可以方便地将他们的工作从一个设备无缝同步到另一个设备…

STM32L051使用HAL库操作实例(14)- ADC采集电压

目录 一、前言 二、ADC外设简要说明 三、STM32CubeMX配置&#xff08;本文使用的STM32CubeMX版本为6.1.2&#xff09; 1.MCU选型 2.时钟使能 3.外部时钟配置 4.串口配置 5.ADC引脚配置 6.配置STM32CubeMX生成工程文件 7.点击GENERATE CODE生成工程文件 四、工程源码 …

Python基础知识:整理13 利用pyecharts生成折线图

首先需要安装第三方包pyecharts 1 基础折线图 # 导包&#xff0c;导入Line功能构建折线图对象 from pyecharts.charts import Line # 折线图 from pyecharts.options import TitleOpts # 标题 from pyecharts.options import LegendOpts # 图例 from pyecharts.options im…

mp4文件全部转换为mp3

问题 今天突发奇想&#xff0c;想把mp4视频转换为mp3来收听&#xff0c;于是想到了ffmpeg工具 步骤 安装ffmpeg环境 要在 Windows 上配置 FFmpeg 环境&#xff0c;你可以按照以下步骤进行操作&#xff1a; 下载 FFmpeg&#xff1a; 首先&#xff0c;你需要下载 FFmpeg 的 W…

一个成功的camera案例:ros2+gazebo+摄像头

各位看&#xff1a;随着大物体的移动&#xff0c;在涉嫌头的位置也发生了改变-----右上角那个/camera的位置也变了 右上角那个是摄像头图案&#xff0c;以下是仓库链接&#xff1a; ros-ign-gazebo-camera: https://github.com/arashsm79/ros-ign-gazebo-camera.git一个ros2摄…

初识物联网

1&#xff1a;什么是IOT&#xff1a; 物联网的英文名称是Internet of Things。IoT则是Internet of Things的缩写。因此, 物联网 IoT。 通俗地说&#xff0c;物联网是互联网的一种拓展。我们知道互联网是由无数的计算机和智能手机交错连接而编织成的一张网。而正是有了像NodeM…

Spring Cloud + Vue前后端分离-第12章 通用权限设计

源代码在GitHub - 629y/course: Spring Cloud Vue前后端分离-在线课程 Spring Cloud Vue前后端分离-第12章 通用权限设计 这一章我们不依赖第三方框架&#xff0c;我会从权限相关表的设计&#xff0c;到权限的配置&#xff0c;到权限的拦截&#xff0c;带大家一步一步的做出…

文章解读与仿真程序复现思路——电网技术EI\CSCD\北大核心《考虑新能源配网三相不平衡治理的电动汽车充电策略》

本专栏栏目提供文章与程序复现思路&#xff0c;具体已有的论文与论文源程序可翻阅本博主免费的专栏栏目《论文与完整程序》 这个标题表明研究着重于开发一种电动汽车充电策略&#xff0c;该策略考虑了在新能源配电网络中存在的三相不平衡问题。解读如下&#xff1a; 电动汽车充…

Typora上传图片失败PicGo

起初我是在Typora中点击一键上传图片&#xff0c;结果如下&#xff0c;报错。可是我找了半天也没错啊。 最后发现原来是一个图片的命名问题&#xff0c;名字太过于复杂&#xff0c;PicGo识别不出&#xff0c;一个图片报错导致其它也上传不了。 我把它复制到其它文件夹之后&…

【QUARTZ】springboot+quartz动态配置定时任务

Quartz 介绍 Quartz 定时任务可分为Trigger&#xff08;触发器&#xff09;、Job&#xff08;任务&#xff09;和Scheduler&#xff08;调度器&#xff09;&#xff0c;定时任务的逻辑大体为&#xff1a;创建触发器和任务&#xff0c;并将其加入到调度器中&#xff0c;如下图所…

webpack原理和逆向实战

文章目录 什么是webpackwebpack基本原理webpack代码分析webpack代码抠取webpack全模块自吐webpack自动扣取总结 什么是webpack webpack是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)&#xff0c;负责分析翻译压缩打包代码。 上面的官网的一张示例图。 web…