JavaScript的核心语法

JavaScript

  • JavaScript：
    • JavaScript的组成：
    • 核心语法：
      • Hello：
      • 变量：
      • JS的基本数据类型：
        • 特殊点：
      • 数组：
      • 流程控制语句：
      • 函数：
        • 函数的重载：
        • 函数的递归:
        • 预定义函数：

JavaScript：

Javascript是基于对象和事件驱动的脚本语言，主要是嵌入到HTML中，应用在客户端，动态操作网页元素，也可以作用于服务端。
 
特点：

  1. 交互性（表单校验，信息提示，动态数据图表，ajax异步提交，解析服务端响应数据等等）。

  2. 安全性（不可以直接访问本地硬盘）。

  3. 跨平台性（由浏览器解析执行，和平台无关）。

JavaScript的组成：

DOM – >Document Object Model

BOM – >Browser Object Model

 
 

核心语法：

Hello：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		
		<script type="text/javascript">
			
			//弹框
			//alert("HelloWorld...1");
			
			//控制台输出
			console.log("HelloWorld...1");
			
		</script>
		
	</head>
	<body>
		
		<script type="text/javascript">
			
			//弹框
			//alert("HelloWorld...2");
			
			//控制台输出
			console.log("HelloWorld...2");
		</script>
		
	</body>
</html>

 
 

变量：

语法格式：
var 变量名 = 值;
 
注意：
       1. var表示变量。
       2. 变量的类型随着值的类型发生改变。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		
		<script type="text/javascript">
			
			var v = 100;
			console.log(v);
			
			v = "abc";
			console.log(v);
			
		</script>
		
	</body>
</html>

 
 

JS的基本数据类型：

分类：
       number - 数值型
       string - 字符串类型
       boolean - 布尔类型
       undefined - 未定义类型
       null - 空类型

tips:

  1. number类型不分整数和小数。
  2. string类型的值可以用单引号也可以用双引号括起来。
  3. string类型和Java的String类型写法不一样。
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		
		<script type="text/javascript">
		
			
			//number - 数值型
			//注意：number类型不分整数和小数
			var num = 100;
			console.log(num);//100
			num = 123.123;
			console.log(num);//123.123
			
			//string - 字符串类型
			//注意：string类型的值可以用单引号也可以用双引号括起来
			var str = 'abc';
			console.log(str);
			str = "abc";
			console.log(str);
			
			//boolean - 布尔类型
			var bool = true;
			console.log(bool);//true
			bool = false;
			console.log(bool);//false
			
			//undefined - 未定义类型
			var v;
			console.log(v);
			v = undefined;
			console.log(v);
			
			//null - 空类型
			var xx = null;
			console.log(xx);
			
			
		</script>
	</body>
</html>

 
 

特殊点：
  1. number类型的特殊点:Infinity表示无穷大。
  2. string类型的特殊点：string加号是字符串拼接符，其余是算数运算符。
  3. boolean类型的特殊点：“”、0、undefined、null表示false。
  4. ==判断两个值是否相等，===判断两个值+类型是否相等。
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			
			//number类型的特殊点
			//注意：Infinity表示无穷大
			console.log(Infinity + (-Infinity));//NaN - Not a Number
			
			//string类型的特殊点
			//注意：string加号是字符串拼接符，其余是算数运算符
			var str1 = "10";
			var str2 = "3";
			console.log(str1 + str2);//103
			console.log(str1 - str2);//7
			console.log(str1 * str2);//30
			console.log(str1 / str2);//3.3333333335
			console.log(str1 % str2);//1
			
			//boolean类型的特殊点
			//注意：""、0、undefined、null表示false
			if(""){
				console.log("true");
			}else{
				console.log("false");
			}
			
			if(0){
				console.log("true");
			}else{
				console.log("false");
			}
			
			if(undefined){
				console.log("true");
			}else{
				console.log("false");
			}
			
			if(null){
				console.log("true");
			}else{
				console.log("false");
			}
			
			//undefined vs null
			var v1 = undefined;
			var v2 = null;
            //typeof判断引用的数据类型
			console.log(typeof v1);//undefined
			console.log(typeof v2);//object
			
			//== vs ===
			//==判断两个值是否相等
			//===判断两个值+类型是否相等
			var v3 = 10;
			var v4 = "10";
			console.log(v3 == v4);//true
			console.log(v3 === v4);//false
		</script>
		
	</body>
</html>

 
 

数组：

​ JS的数组和Java的数组不一样，Java数组定义大小后就不能改变长度了，而JS数组可以随意改变长度。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		
		<script type="text/javascript">
			
			var arr = ["小红","小明","小灰"];
			
			//设置指定下标上的元素
			arr[0] = "小黑";
			
			//获取指定下标上的元素
			console.log("获取指定下标上的元素：" + arr[0]);//小黑
			
			//获取元素个数
			console.log("获取元素个数：" + arr.length);
			
			//添加元素
			arr[3] = "小白";
			arr[4] = "小绿";
			arr[10] = "小蓝";
			
			//删除元素
			delete arr[4];
			
			console.log("--------------------");
			
			//遍历数组 - for循环
			for(var i = 0;i<arr.length;i++){
				console.log(arr[i]);
			}
			
			console.log("--------------------");
			
			//遍历数组 -- for-in
			//注意：遍历有效元素的下标（undefined的元素认为是无效元素）
			for(var index in arr){
				console.log(arr[index]);
			}
			
		</script>
		
	</body>
</html>

 
 

流程控制语句：

  1. If else
  2. For
  3. For-in(遍历数组时，跟Java是否一样)
  4. Whil
  5. Do while
  6. break 语句用于跳出循环。
  7. continue 用于跳过循环中的一个迭代。

需求：求1-100之间的偶数之和。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		
		<script type="text/javascript">
		
			var sum = 0;
			for(var i = 1;i<=100;i++){
				if(i%2 == 0){
					sum += i;
				}
			}
			
			console.log("1~100之间偶数之和为：" + sum);
			
			
		</script>
		
	</body>
</html>

 
 

需求：我的梦想:第一个月存3000，每年递增1000，问多少个月后可以存到20万元。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		
		<script type="text/javascript">
		
			var allMoney = 0;
			var money = 3000;
			var month = 0;
			
			while(allMoney < 200000){
				allMoney += money;
				month++;
				if(month % 12 == 0){
					money += 1000;
				}
			}
			
			console.log(month + "个月后存满20万");
			
			
			
		</script>
		
	</body>
</html>

 
 

需求：

打印图形

					*
					**
					***
					****
					*****

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		
		<script type="text/javascript">
			
			
			for(var i = 0;i<5;i++){
				for(var j = 0;j<=i;j++){
					document.write("*");
				}
				document.write("<br/>");
			}

		</script>
		
	</body>
</html>

 
 

​
​

函数：

语法结构：
 
function 函数名(参数列表){

…代码块…
}

注意：函数就是方法。

函数分类：
       1. 无参无返回值的函数。
       2. 带参数的函数。
       3. 带返回值的方法。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			//无参无返回值的函数
			function fun01(){
				console.log("今天天气真好1");
			}
			fun01();
			
			//带参数的函数
			//注意：形参不需要加类型，调用方法时可以传参也可以不传参
			function fun02(a,b){
				console.log("今天天气真好2：" + a + " -- " + b);
			}
			fun02();
			fun02(10,20);
			fun02("xxx","yyy");
			fun02("abc",12345);
			
			//带返回值的方法
			//注意：JS函数里的返回值不用像Java方法里必须指定返回值类型
			function fun03(){
				return "今天天气真好3";
			}
			var v = fun03();
			console.log(v);
		</script>
	</body>
</html>

tips:

​        1. 形参不需要加类型，调用方法时可以传参也可以不传参。

​        2. JS函数里的返回值不用像Java方法里必须指定返回值类型。

 
 

函数的重载：

JS的函数里没有重载的概念，后面定义的相同名称的方法会覆盖前面相同名称的方法。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			
			function fun(a,b){
				alert(a+b);
			}
			
			function fun(a,b,c){
				alert(a+b+c);
			}
			
			//a - 10
			//b - 20
			//c - undefind
			fun(10,20);//NaN
		</script>
	</body>
</html>

 
 

函数的递归:

递归是一种思想，只要是面向对象的语言都有这个思想。

需求：设计一个函数，传入n，求n的阶乘。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
		
			function fun(n){
				if(n != 1){
					return fun(n-1)*n;
				}else{
					return 1;
				}
			}
			
			var num = fun(5);
			alert(num);
		</script>
	</body>
</html>

 
 

预定义函数：
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		
		<script type="text/javascript">
			
			console.log("判断参数是否是数字：" + isFinite("abc"));//false
			console.log("判断参数是否不是数字：" + isNaN("abc"));//true
			console.log("将字符串转换为整数：" + parseInt("100.123"));//100
			console.log("将字符串转换为小数：" + parseFloat("100.123"));//100.123
			
			var str = "alert('今天真是个好日子');";
			eval(str);//认为字符串为js代码去执行
			
		</script>
		
	</body>
</html>

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

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

python-windows10普通笔记本跑bert mrpc数据样例0.1.001

python-windows10普通笔记本跑bert mrpc数据样例0.1.001

python-windows10普通笔记本跑bert mrpc数据样例0.1.000 背景参考章节获取数据下载bert模型下载bert代码windows10的cpu执行结果注意事项TODOLIST背景 看了介绍说可以在gpu或者tpu上去微调，当前没环境，所以先在windows10上跑一跑，看是否能顺利进行，目标就是训练的过程中没…
阅读更多...
WWDC24即将到来，ios18放大招

WWDC24即将到来，ios18放大招

苹果公司即将在下周开全球开发者大会(WWDC)&#xff0c;大会上将展示其人工智能技术整合到设备和软件中的重大进展,包括与OpenAI的历史性合作。随着大会的临近,有关iOS 18及其据称采用AI技术支持的应用程序和功能的各种泄露信息已经浮出水面。 据报道,苹果将利用其自主研发的大…
阅读更多...
WPF国际化的最佳实践

WPF国际化的最佳实践

WPF国际化的最佳实践 1.创建项目资源文件 如果你的项目没有Properties文件夹和Resources.resx文件&#xff0c;可以通过右键项目-资源-常规-添加创建或打开程序集资源 2.添加国际化字符串 打开Resources.resx文件&#xff0c;添加需要翻译的文本字符&#xff0c;并将访问修…
阅读更多...
深入了解 Postman 中的变量

深入了解 Postman 中的变量

在我们进行 API 开发和测试时&#xff0c;使用诸如 Postman 之类的工具可以极大地简化工作流程&#xff0c;提高效率。Postman 的一个强大功能就是变量&#xff08;Variables&#xff09;。利用变量&#xff0c;我们可以使我们的请求变得更加动态和灵活&#xff0c;避免重复输入…
阅读更多...
计算机组成实验---Cache的实现

计算机组成实验---Cache的实现

直接映射 先看懂cache的映射原理&#xff0c;根据cache大小与主存大小来计算各个信号线的位数 各个信号线位数 主存地址在逻辑上分为区号、块号、块内地址 Cache结构 Cache访问原理 基本过程 状态机&#xff1a;“三段式”实现 6.3 Verilog 状态机 | 菜鸟教程 (runoob.com) …
阅读更多...
问题：当频点数大于载波数时，（） #学习方法#知识分享

问题：当频点数大于载波数时，（） #学习方法#知识分享

问题&#xff1a;当频点数大于载波数时&#xff0c;&#xff08;&#xff09; A.基带跳频可以执行&#xff0c;混合跳频可以执行 B.基带跳频不可以执行&#xff0c;混合跳频可以执行 C.基带跳频可以执行&#xff0c;混合跳频不可以执行 D.基带跳频不可以执行&#xff0c;混…
阅读更多...
2024-06-07 Unity 编辑器开发之编辑器拓展8 —— Scene 窗口拓展

2024-06-07 Unity 编辑器开发之编辑器拓展8 —— Scene 窗口拓展

文章目录 1 Handles 类1.1 Scene 响应函数1.2 自定义窗口中监听 Scene1.3 Handles 常用 API2.2.1 颜色控制2.2.2 文本2.2.3 线段2.2.4 虚线2.2.5 圆弧2.2.6 圆2.2.7 立方体2.2.8 几何体2.2.9 移动、旋转、缩放2.2.10 自由移动 / 旋转 2 Scene 窗口中显示 GUI3 HandleUtility4 G…
阅读更多...
React 18

React 18

创建 React 18 脚手架项目 全局安装 create-react-app npm install -g create-react-app yarn global add create-react-app . 确认是否已安装 create-react-app npm list -g create-react-app yarn global list | grep create-react-app . 如果安装失败 有时&#xff0…
阅读更多...
YOLOv8---seg实例分割（制作数据集，训练模型，预测结果）

YOLOv8---seg实例分割（制作数据集，训练模型，预测结果）

YOLOv8----seg实例分割&#xff08;制作数据集&#xff0c;训练模型&#xff0c;预测结果&#xff09; 内容如下&#xff1a;【需要软件及工具&#xff1a;pycharm、labelme、anaconda、云主机&#xff08;跑训练&#xff09;】 1.制作自己的数据集 2.在yolo的预训练模型的基础…
阅读更多...
Linux系统下 安装 Nginx

Linux系统下 安装 Nginx

一、下载Nginx安装包 压缩包下载地址&#xff1a;nginx: download 服务器有外网&#xff0c;可直接使用命令下载 wget -c https://nginx.org/download/nginx-1.24.0.tar.gz 二、安装Nginx 1、解压 tar -zxvf nginx-1.24.0.tar.gz 2、安装Nginx所需依赖 yum install -y gc…
阅读更多...
顶顶通呼叫中心中间件-asr录音路径修改(mod_cti基于FreeSWITCH)

顶顶通呼叫中心中间件-asr录音路径修改(mod_cti基于FreeSWITCH)

顶顶通呼叫中心中间件-asr录音路径修改(mod_cti基于FreeSWITCH) 录音路径模板。如果不是绝对路径&#xff0c;会把这个路径追加到FreeSWITCH的recordings后面。支持变量&#xff0c;比如日期 ${strftime(%Y-%m-%d)}。最后一个录音文件路径会保存到变量 ${cti_asr_last_record_…
阅读更多...
[职场] 项目实施工程师的工作前景 #笔记#经验分享

[职场] 项目实施工程师的工作前景 #笔记#经验分享

项目实施工程师的工作前景 项目实施工程师是负责将软件产品或解决方案实施到客户现场并确保项目成功落地的工作岗位。他们要负责整个项目的规划、组织、执行和控制&#xff0c;确保项目按照预定的进度、质量和预算完成。 一&#xff0e;工作内容 1. 项目规划&#xff1a;确定…
阅读更多...
docker部署fastdfs

docker部署fastdfs

我的镜像包地址 链接&#xff1a;https://pan.baidu.com/s/1j5E5O1xdyQVfJhsOevXvYg?pwdhcav 提取码&#xff1a;hcav docker load -i gofast.tar.gz拉取gofast docker pull sjqzhang/go-fastdfs启动gofast docker run -d --name fastdfs -p 8080:8080 -v /opt/lijia/lijia…
阅读更多...
耐酸碱腐蚀可溶性聚四氟乙烯(PFA)溶样罐

耐酸碱腐蚀可溶性聚四氟乙烯(PFA)溶样罐

PFA溶样罐也叫PFA溶样瓶&#xff0c;可直接放在加热板上及油浴里加热&#xff0c;也可液氮下长期保存&#xff0c;使用温度-200—260℃。 根据不同实验的需求&#xff0c;PFA溶样罐有U型、V型、平底3种设计。V型底的设计&#xff0c;更加方便少量样品的集中收集。溶样罐广泛用…
阅读更多...
Linux-桌面操作系统在服务器上未关闭休眠机制，使其开机半小时左右死机无法远程ssh连接

Linux-桌面操作系统在服务器上未关闭休眠机制，使其开机半小时左右死机无法远程ssh连接

故障表述 操作系统：ubuntu desktop 18.04 异常描述：开机半小时左右死机 1、登录iBMC查看硬件无异常 2、登录ubuntu desktop 18.04操作系统，导出日志文件syslog、dmesg、lastlog（路径：/var/log），操作系统在11月8号~11月9号之间出现异常 经分析操作系统日志文件，操作系…
阅读更多...
项目经理进入职场都会经历的三个阶段

项目经理进入职场都会经历的三个阶段

对于项目经理而言&#xff0c;进入职场是一个不断学习和成长的过程。在这个过程中&#xff0c;项目经理通常会经历三个主要阶段&#xff0c;每个阶段都有其独特的特点和挑战。 一、基础建设与学习阶段 对于新入行的项目经理来说&#xff0c;最初的阶段主要是基础技能的积累和…
阅读更多...
利用keepalived对zabbix-server做高可用，部署安装keepalived

利用keepalived对zabbix-server做高可用，部署安装keepalived

有2台机器&#xff0c;每台都有1个zabbix-server&#xff0c;然后再每台上再装一个keepalived https://www.keepalived.org/download.html 1&#xff0c;创建安装路径 mkdir /usr/share/keepalived/2&#xff0c;在这个安装路径下面下载keepalived的软件包 我选的版本是1.3…
阅读更多...
k8s-pod参数详解

k8s-pod参数详解

目录 概述创建Pod编写一个简单的Pod添加常用参数为Pod的容器分配资源网络相关Pod健康检查启动探针存活探针就绪探针 作用整个Pod参数配置创建docker-registry 卷挂载 结束 概述 k8s中的pod参数详解。官方文档   版本 k8s 1.27.x 、busybox:stable-musl、nginx:stable-alpine3…
阅读更多...
记忆++入门01

记忆++入门01

1.数字编码 2. 地点桩 1. 卧室 2.婴儿房 3.卫生间 4.次卧 5.书房 6.厨房 7.餐厅 8.客厅 9.阳台左 10.阳台右
阅读更多...
ssh远程转发22端口，使用shell工具进行连接|使用服务器地址ssh连接本地ubuntu|端口映射

ssh远程转发22端口，使用shell工具进行连接|使用服务器地址ssh连接本地ubuntu|端口映射

☆ 问题描述 我在内网主机中&#xff0c;使用docker创建了多个虚拟机&#xff0c;我希望能通过我的公网ip服务器端口进行shell访问 ★ 解决方案 我创建一个新的虚拟机为例 1. 创建并打开容器 docker run -itd --name test ubuntu2. 进入容器 docker exec -it test /bin/b…
阅读更多...
最新文章

Copyright @ 2022~2023