认识JavaScript （9.12）

淡忘728

已于 2022-09-14 12:12:02 修改

阅读量133

点赞数

文章标签： javascript 开发语言 ecmascript

于 2022-09-12 22:18:08 首次发布

本文链接：https://blog.csdn.net/weixin_65824274/article/details/126822758

版权

学习JavaScript

1.验证用户输入的内容

2.有效的组织网页内容

3.动态的显示网页内容，动画显示

4.弥补静态网页不能实现的功能

JavaScript简介

JavaScript是一种基于对象的脚本语言，是网景公司(Netscape)最初在它的Navigator2.0产品上设计并实现的，其前身叫做LiveScript。语法上，JavaScript和C#、java等编程语言类似。

JavaScript是客户端脚本语言，也就是说，JavaScript是在客户的浏览器上运行的，不需要服务器的支持。

JavaScript是一种解释语言，其源代码在客户端执行之前不需要经过编译，而是将文本格式的字符代码在客户端由浏览器解释执行。这就是说，JavaScript需要浏览器支持。

JavaScript语言特点

<1>脚本语言 <2> 解释性 <3>用于客户端 <4>基于对象

1.用户输入 →IE等浏览器(解析HTML标签和JavaScript)→2.发送请求→客户端请求含JS的页面→服务器→3.返回响应→从服务器端下载含JavaScript的页面

JavaScript编写规范

<1>一般放在<head>...</head>中间
<2>逐行被执行，越短越好
<3>大小写敏感
<4>语句是基本单位，通常以(分号) ; 表示语句结束
<5>多行语句可以作为一块，使用{}
<6>多使用注释(单行注释/多行注释)

编写JavaScript的基本流程
布局 :HTML/ASPNET+CSS 向页面输出内容 :   document.write(文本内容)
属性 :确定要修改哪些属性    弹出警告框 : alert(文本内容)
事件 :确定用户进行哪些操作? 编写 :在事件中，用JavaScript来完成用户需求输入语句 : 1.prompt(“标题”"默认值”)，不建议使用     2.通过表单元素进行输入

编写js代码，必须使用script标签在HTML中使用JavaScript有两种方法: (1)把JavaScript代码写在<script>……</script>标签中，将标签插入到网页中 (2)由在<script>标签中使用的src属性指定使用外部脚本文件(.js)

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<!-- 编写js代码，必须使用script标签 -->
		<script type="text/javascript">
            //弹出对话框
			alert("Hello Word!")
		</script>
	</body>
	<!-- 用于引入外部的js文件 -->
	<script type="text/javascript" src="js/HelloWord.js">
		//以下代码不会被执行
		alert("我是用来引入外部样式js文件的script标签")
	</script>
</html>

js编写的位置以及注意事项
1.js代码写在script标签内，script标签可以放在head、body标签内，也可以写在body外、html标签外，但是建议写在body标签的最下面
2.可以使用script标签引入一个外部的js文件，同时要注意在该标签内是不能写js代码的，即使写了也不会执行

JavaScrip的核心构成

变量数据类型表达式语句函数内置对象注释

JavaScript的数据类型( 使用typeof运算符可以查看变量的数据类型 )

输出变量的数据类型到页面：document.write(typeof 变量名)

输出变量的内容到控制台: console.log(x,y,z)

输出变量混合后数据类型到控制台: console.log(typeof(a+b))

基本数据类型
数值数据类型(number)
布尔类型(boolean)
未定义数据类型(undefined) 一个变量被声明了，但是未赋值。
空数据类型(null)
引用数据类型
字符串类型(string)
Array 数组类型
对象类型(Object)

变量的声明和赋值

声明一个变量，需要使用一个关键词var，变量的数据类型是由变量后面赋的值的数据类型来决定的语法格式: var 变量名=变量的值

1.先声明变量，然后赋值

2.同时声明和赋值变量

3.声明多个变量，使用逗号

混合计算数据类型

整数与小数=小数小数与布尔型=小数
整数与字符串=字符串小数与空值=小数
整数与布尔型=整数字符串与布尔型=字符串
整数与空值=整数字符串与空值=字符串
小数与字符串=字符串布尔型与空值=整数

document.write("<br />")换行

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			//多种数据类型之间进行运算，计算结果的数据类型都是什么
			console.log(typeof(12 + 0.5)) //number
			console.log(typeof("张三" + 0.5)) //string
			console.log(typeof("张三" + "性别：男")) //string
			console.log(typeof(10 + true)) //number
			console.log(typeof(10 + null)) //number
			console.log(typeof(0.5 + false)) //number
			console.log(typeof(0.5 + null)) //number
			console.log(typeof("张三" + null)) //string
			console.log(typeof("张三" + true)) //string
			console.log(typeof(true + null)) //number
		</script>
	</body>

</html>

数据类型的转换

parselnt(string):将字符串转为整型数字，取整；将字符串转化成整数，会将小数点后面的数字给去掉，不会进行四舍五入

parseFloat(string):将字符串转换为浮点型数字

<script type="text/javascript">
//数据类型转换
//将字符串转化成整数，parseInt(),会将小数点后面的数字给去掉，不会进行四舍五入
var c ="12.5"
console.log(parseInt(c))
var d =10
var e = parseInt(c)+parseInt(d)
console.log(e)
//parseFloat():将一个字符串转换成浮点型
console.log(parseFloat(c))		
</script>

表达式与运算符

表达式是对一个或多个变量或值(操作数)进行运算，并返回一个新值

运算符可分为以下类别:
赋值运算符 =
算术运算符 +、-、*、/、%(取余)、++(自增)、--、-(求反) (++自增运算:当++在后面时，先使用再自增；当++在前面时，先自增后使用) 结合运算符*=/=+=-=%=
比较运算符 ==、!=、>、>=、<、<=、===、!== 逻辑运算符 &&、I|、!

<script type="text/javascript">
			// == === 区别:==表示值相等  ===表示值相等，数据类型也必须相等
			var b = 12
			var c = "10"
			console.log(x == y) //true
			console.log(x === y) //false
		</script>

<script type="text/javascript">
			//逻辑运算符  && || ！
			var d = 11,e = 12
			console.log((d + e) > 20 && d > 11) //false
			console.log((d + e) > 20 || d > 11) //true
			console.log(!(d + e) > 20) //false
			//console.log(d>5 && d++>11)//d++未执行 d=12
			console.log(d > 5 || d++ > 11) //d++执行 d=11
			console.log(d)
		</script>

字符串运算 + (字符串拼接)

<script type="text/javascript">
			//从键盘输入两个数字，进行加法运算
			var num1 = prompt("请输入第一个数:")//从键盘输入一个数字，并将该数字赋值给变量num1
			var num2 = prompt("请输入第二个数:")
			var num3 = num1+num2
			//字符串拼接
			console.log(num3)
			//数据类型转换
			console.log(parseInt(num1)+parseInt(num2))
			var a = 10,b=12
			//先将变量的数据类型转换成字符串
			console.log(a.toString()+b.toString())
			var isfalse = false
			console.log(typeof isfalse.toString())
		</script>

绝对等于:数据类型一致，数值相等不绝对等于:数据类型不一致或者数值不相等
1.数据类型不一致
2.数值不相等
3.数据类型不一致，数值也不相等

三元运算符条件表达式?真:假

<script type="text/javascript">
		//三元运算符  条件表达式?真:假
		//求三个数中的最大值
		var x=10,y=20,z=30
		var result = 0//用来存储最大值
		result = x>y?x:y,
		result = result>z?result:z,
		console.log(result)
		</script>

淡忘728

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
认识JavaScript （9.12）

编写 :在事件中，用JavaScript来完成用户需求输入语句 : 1.prompt(“标题”"默认值”)，不建议使用 2.通过表单元素进行输入。1.js代码写在script标签内，script标签可以放在head、body标签内，也可以写在body外、html标签外，但是建议写在body标签的最下面。算术运算符 +、-、*、/、%(取余)、++(自增)、--、-(求反)，也就是说，JavaScript是在客户的浏览器上运行的，
复制链接

扫一扫