HTML+JavaScript-03

JavaScript函数

定义函数的格式

JavaScript 函数是通过 function 关键词定义的。

function sum(a, b){//函数体return a + b;//返回值为a、b的和
}

函数的调用

调用函数时直接书写函数名即可

function show(){alert("函数show被调用");
}
show();

函数的相互调用

function fun1(){fun2();console.log("函数1");
}
function fun2(){fun3();console.log("函数2");
}
function fun3(){console.log("函数3");
}
fun1();

image-20240122155902322

形参和实参

定义函数时参数为形参

调用函数传入的参数为实参

函数调用流程是实参传值给形参供函数体使用

function sum(a, b){//a和b都是形参return a + b;
}
//调用函数
sum(1, 99);//1和99是实参

实参的数量以及数据类型要和形参一致,若传入实参过多,则函数不接收多余的部分,若传入实参过少,则会出现undefined

函数的返回值

return 返回值;

return有终止函数的作用

案例-1-使用函数实现判定某个数字是不是素数是返回true不是返回false

// 使用函数实现判定某个数字是不是素数是返回true不是返回false
function primeNumber(number) {if (number <= 1) {return false;}for (let i = 2; i < number; i++) {if (number % i == 0) {return false;}}return true;
}
let B = Number(prompt("输入一个数"));
alert(primeNumber(B));

案例-048

案例-2-编写函教实现去除任意数组中重复的值

// 编写函教实现去除任意数组中重复的值
function removeValue(params) {for (let i = 0; i <= params.length - 1; i++) {for (let j = params.length; j >= i + 1; j--) {if (params[i] == params[j]) {params.splice(j, 1);}}}// alert(params);return params;
}
const A = [1, 1, 1, 3, 3, 3, 1, 2, 4, 7, 5, 4];
console.log(removeValue(A));

image-20240122161922935

案例-3-写一个函数,输入两个年份,用来计算两个年之间的闰年有多少个。

// 写一个函数,输入两个年份,用来计算两个年之间的闰年有多少个。
function leapNumber(yearA, yearB) {let max = yearA > yearB ? yearA : yearB;let min = yearA < yearB ? yearA : yearB;let num = 0;for (min; min < max; min++) {if ((min % 4 == 0 && min % 100 != 0) || min % 400 == 0) {num++;}}document.write(yearA + "年到" + yearB + "年有闰年" + num + "个");
}
let A = +prompt("请输入第一个年份");
let B = +prompt("请输入第二个年份");
leapNumber(A, B);

案例-049

案例-4-定义一个方法用来检测数组里面是否有某一个值

// 定义一个方法用来检测数组里面是否有某一个值// 循环查找数组中的数
function haveNum(array, params) {// const array = [1, 2, 3, 4, 5, 6, 7, 8, 11, 22, 33, 44, 55, 66, 777];for (let i = 0; i <= array.length - 1; i++) {if (params == array[i]) {alert(array + "数组中有" + params);break;}if (i == array.length - 1 && params != array[array.length]) {alert("false");break;}}
}// 输入长度为arrLength的数组
function arr(arrLength) {const array = [];for (let j = 0; j <= arrLength - 1; j++) {array.push(prompt("输入第数组中的" + (j + 1) + "个数"));}return array;
};let length = +prompt("输入数组长度");
const array = arr(length);
alert("数组"+array);let num = Number(prompt("输入你要查找的数"));
haveNum(array, num);

案例-050

案例-5-求数组当中的最大值并返回

// 编写一个函数求数组当中的最大值并返回 如果数组为空返回undefined
function arrMax(array) {let max = 0;if (array.length == 0) {alert(undefined);} else {for (let i = 0; i <= array.length - 1; i++) {if (array[i] > max) {max = array[i];}}// alert("max=" + max);return max;}
}
const array = [14, 4, 3, 15, 77, 34, 55, 998, 102, 1111110];
alert(arrMax(array));

image-20240122163353372

案例-6-双色球

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>双色球</title>
</head><body><script>function getReds() {const reds = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10,11, 12, 13, 14, 15, 16, 17, 18, 19, 20,21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33];const newReds = [];for (let i = 0; i < 6; i++) {let index = parseInt(Math.random() * reds.length);// newReds.push(reds[index]);flag = true;for (let j = newReds.length; j >= 0; j--) {if (newReds[j] == reds[index]) {i--;flag = false;break;}}if (flag) {newReds[i] = reds[index];}}return newReds;}function getBlue() {const blues = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10,11, 12, 13, 14, 15, 16];let index = parseInt(Math.random() * blues.length);return blues[index];}function wanning() {const a = getReds();const b = getBlue();a.push(b)return a;}function contrast(wanningNum, myNum) {let redNum = 0;let blueNum = 0;for (let i = 0; i <= wanningNum.length - 1; i++) {for (let j = 0; j < myNum.length - 1; j++) {if (wanning[i] == myNum[j]) {redNum++;}}}if (wanningNum[wanningNum.length - 1] == myNum[myNum.length - 1]) {blueNum++;}if (redNum == 6 && blueNum == 1) {return "一等奖";} else if (redNum == 6 && blueNum == 0) {return "二等奖";} else if (redNum == 5 && blueNum == 1) {return "三等奖";} else if (redNum == 5 || redNum == 4 && blueNum == 1) {return "四等奖";} else if (redNum == 4 || redNum == 3 && blueNum == 1) {return "五等奖";} else if (blueNum == 1 || (redNum == 1 && blueNum == 1) || (redNum == 2 && blueNum == 1)) {return "六等奖";} else {return "未中奖";}}// document.write(getReds());// document.write("<br/>");// document.write(getBlue());// document.write("<br/>");// document.write(wanning());const A = wanning();document.write(A);document.write("<br/>");const B = wanning();document.write(B);document.write("<br/>");document.write(contrast(A, B));</script>
</body></html>

案例-051

JavaScript 对象

真实生活中的对象,属性和方法

真实生活中,一辆汽车是一个对象。

对象有它的属性,如重量和颜色等,方法有启动停止等:

image-20240122163859457

所有汽车都有这些属性,但是每款车的属性都不尽相同。

所有汽车都拥有这些方法,但是它们被执行的时间都不尽相同。

JavaScript 对象

对象也是一个变量,但对象可以包含多个值(多个变量),每个值以 name:value 对呈现。

var car = {name:"丰田",model:"500",weight:"850kg",color:"white"
};

定义JavaScript对象时可以跨越多行,不同属性间用,隔开。

也可以用函数来创建对象性的属性,然后调用函数创建对象。

function Person(name, age, sex) {this.name = name;this.age = age;this.sex = sex;
}
var tom = new Person("tom", 11, "男");
console.log(tom);

image-20240122165636225

可以再创建一个Person对象

var jerry = new Person("jerry", 14, "女");

查找jerry的age属性

jerry.age

也可以对Person类的对象新添加属性

tom.hobby = "篮球";

可以看到只对tom添加了该属性,jerry的属性并没有增加。

image-20240122171633226

删除属性

delete tom.hobby;
delete tom.age;
console.log(tom);

image-20240122172036401

this

this在一个方法中指调用的对象(即谁调用这个函数,函数中的this就指向谁)

比较对象

在 JavaScript 中 objects 是一种引用类型。两个独立声明的对象永远也不会相等,即使他们有相同的属性,只有在比较一个对象和这个对象的引用时,才会返回 true.

// 两个变量,两个具有同样的属性、但不相同的对象
var fruit = { name: "apple" };
var fruitbear = { name: "apple" };fruit == fruitbear; // return false
fruit === fruitbear; // return false

备注: “===” 运算符用来检查数值是否相等:1 === "1"返回 false,而 1 == “1” 返回 true

// 两个变量,同一个对象
var fruit = { name: "apple" };
var fruitbear = fruit; // 将 fruit 的对象引用 (reference) 赋值给 fruitbear
// 也称为将 fruitbear“指向”fruit 对象
// fruit 与 fruitbear 都指向同样的对象
fruit == fruitbear; // return true
fruit === fruitbear; // return true

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

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

相关文章

使用Docker部署Apache Superset结合内网穿透实现远程访问本地服务

文章目录 前言1. 使用Docker部署Apache Superset1.1 第一步安装docker 、docker compose1.2 克隆superset代码到本地并使用docker compose启动 2. 安装cpolar内网穿透&#xff0c;实现公网访问3. 设置固定连接公网地址 前言 Superset是一款由中国知名科技公司开源的“现代化的…

PSEUDO-LIDAR++:自动驾驶中 3D 目标检测的精确深度

论文地址&#xff1a;PSEUDO-LIDAR: ACCURATE DEPTH FOR 3D OBJECT DETECTION IN AUTONOMOUS DRIVING 论文代码&#xff1a;https://github.com/mileyan/Pseudo_Lidar_V2 摘要 3D 检测汽车和行人等物体在自动驾驶中发挥着不可或缺的作用。现有方法很大程度上依赖昂贵的激光雷…

ChatGPT Claude Bard 生成式 AI 免责声明

ChatGPT Claude Bard 生成式 AI 免责声明 ChatGPT can make mistakes. Consider checking important information.Claude.ai is in beta release and may display incorrect or harmful informationBard may display inaccurate info, including about people, so double-check…

华为数通方向HCIP-DataCom H12-831题库(判断题:81-100)

第81题 基本QinQ能根据业务种类选择外层Tag封装的方式 正确 错误 答案: 错误 解析: 基本QinQ是基于端口方式实现的,不能根据业务种类选择外层TAG封装的方式。 第82题 display interface GE0/0/0-次,发现Total Error计数(该接口物理层的错误报文总数目)不是此时可以断定当前…

【Spring Boot 3】【Redis】集成Redisson

【Spring Boot 3】【Redis】集成Redisson 背景介绍开发环境开发步骤及源码工程目录结构总结背景 软件开发是一门实践性科学,对大多数人来说,学习一种新技术不是一开始就去深究其原理,而是先从做出一个可工作的DEMO入手。但在我个人学习和工作经历中,每次学习新技术总是要花…

CentOS7 开启防火墙及开放指定端口

CentOS7 开启防火墙及开放指定端口 查看防火墙状态systemctl status firewalld启动防火墙systemctl start firewalld停止防火墙systemctl stop firewalld查看防火墙已经开放的端口firewall-cmd --list-port添加开放指定防火墙firewall-cmd --zonepublic --add-port这里是需要开…

登录页面(附源码)

特色&#xff1a; 点击登录之后卡片翻转效果 话不多说&#xff0c;看展示。 还在等什么&#xff0c;赶快白嫖起来吧 HTML文件 <div id"window" style"display: none"><div class"page page-front"><div class"page-content&…

一些 AI 机构

文章目录 OpenAITHUDMMetaAITIIStability AINousResearch OpenAI hf : https://huggingface.co/openai 官网&#xff1a;https://openai.com THUDM 清华大学 KEG 和 THUDM 团队 Knowledge Engineering Group (KEG) & Data Mining at Tsinghua University hf : https://h…

SCCB接口

文章目录 概述引脚传输时序起始/结束信号三线模式两线模式 传输周期3阶段写传输周期2阶段写传输周期2阶段读传输周期阶段一 ID Address阶段二 子地址/读数据阶段三 写数据 SCCB与IIC区别未完待续(还有代码&#xff09;... 概述 SCCB&#xff08;Serial Camera Control Bus&…

ElementUI简介以及相关操作

ElementUI是一套基于Vue.js的桌面端组件库&#xff0c;提供了丰富的组件帮助开发人员快速构建功能强大、风格统一的页面。以下是ElementUI的简介以及相关操作&#xff1a; 简介&#xff1a;ElementUI是一套为开发者、设计师和产品经理准备的基于Vue 2.0的桌面端组件库&#xff…

aspose-cells-20.7.jar 去除水印及次数限制

1.使用 jd-gui.exe 反编译查看&#xff0c;直接搜索 License 1.修改 public static boolean isLicenseSet() {return (a ! null);}改成 public static boolean isLicenseSet() {return true;}2.修改 public void setLicense(InputStream stream) {Document document null;if (…

【EI会议征稿通知】2024年第四届人工智能、自动化与高性能计算国际会议(AIAHPC 2024)

2024年第四届人工智能、自动化与高性能计算国际会议&#xff08;AIAHPC 2024&#xff09; 2024 4th International Conference on Artificial Intelligence, Automation and High Performance Computing 2024第四届人工智能、自动化与高性能计算国际会议(AIAHPC 2024)将于20…

SpringMVC:拦截器

一般我们会做一些统一的操作这个时候我们需要使用springmvc提供的拦截器&#xff0c;例如token的验证&#xff0c;字段必填的操作&#xff0c;接口超时判断&#xff0c;签名验证&#xff0c;字段加密等操作&#xff0c;所以我们需要了解执行先后顺序。 我们来简单介绍下实现过程…

第6章-路由器、交换机及其操作系统介绍

目录 1. 路由器与交换机的作用与特点 1.1. 路由器 1.2. 交换机 1.3. 路由交换 2. H3C路由器与交换机介绍 3. H3C网络设备操作系统Comware 1. 路由器与交换机的作用与特点 1.1. 路由器 1、定义&#xff1a;路由器&#xff08;Router&#xff09;是连接两个或多个网络的硬…

穿越Flink的时间隧道:解锁实时数据之窗,掌握流处理之巅

目录 Flink中的时间和窗口 1时间语义 1.1Flink中的时间语义 1.1.1处理时间 1.1.2事件时间 1.2那种时间语义更重要 2 水位线 2.1 事件时间和窗口 2.2 什么是水位线 2.3 如何生成水位线 2.3.1使用WatermarkGenerator 2.3.2使用SourceFunction 2.4 水位线的传递 2.5 水位…

bvh转fbx python实战代码

目录 参数含义: bvh转fbx python实战代码 参数含义: 参考: Export Scene Operators — Blender Python API filepath (string, (optional, never None)) – File Path, Filepath used for exporting the file check_existing (boolean

R语言中数据框是什么?

在数据分析过程中离不开表格&#xff0c;通常使用Excel来做数据分析&#xff0c;行和列用来存放不同的数据&#xff0c;表格能清晰直观的展示数据&#xff0c;而且可以将多张表组合联系起来&#xff0c;这种不约而同的规范也同样适用于R语言。 R语言中的数据框&#xff08;Data…

2023年度环境电器行业数据分析(洗地机、扫地机器人、吸尘器等)

在家电行业整体消费不振的环境下&#xff0c;环境电器市场也受到影响&#xff0c;2023年度市场大盘销售呈下滑趋势。根据鲸参谋平台的数据显示&#xff0c;2023年京东平台环境电器市场的销量累计约7100万&#xff0c;同比下滑约12%&#xff1b;销售额约360亿&#xff0c;同比下…

移动端自适应解决方法(原理是rem布局)

adaptive 点击跳转官方Git地址 此博客参考笔记 也可以直接复制下方的js文件直接使用 index.js var adaptive {}; (function (win, lib) {var doc win.document;var docEl doc.documentElement;// 设备像素比var devicePixelRatio win.devicePixelRatio;// 我们设置的布…

JavaScript 示例: jsencrypt 私钥 16位密码短语 + cryptojs AES加解密

JavaScript 示例: jsencrypt 私钥 16位密码短语 cryptojs AES加解密 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"…