认识JavaScript

辣椒沾辣酱啦

已于 2022-11-26 19:03:25 修改

阅读量384

点赞数

文章标签： javascript 前端开发语言

于 2022-09-12 19:32:54 首次发布

本文链接：https://blog.csdn.net/weixin_70676044/article/details/126820603

版权

第一章认识JavaScript

1.1 JavaScript简介

JavaScript是一种基于对象的脚本语言，是网景公司(Netscape)最初在它的Navigator2.0产品上设计并实现的，其前身叫做LiveScript。语法上，JavaScript和C#，java等编程语言类似。
JavaScript是客户端脚本语言，也就是说，JavaScript是在客户的浏览器上运行的，不需要服务器的支持。
JavaScript是一种解释语言，其源代码在客户端执行之前不需要经过编译，而是将文本格式的字符代码在客户端由浏览器解释执行。这就是说，JavaScript需要浏览器支持。

1.2 JavaScript语言特点

脚本语言
解释性
用于客户端
基于对象

1.3 JavaScript编写规范

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

1.4 编写JavaScript的基本流程

1.布局

HTML/ASP.NET+CSS

2.属性

确定要修改哪些属性

3.事件

确定用户进行哪些操作

4.编写

在事件中，用JavaScript来完成用户需求

5.向页面输出内容

document.write(文本内容）

6.弹出警告框

alert（文本内容）

7.输入语句

prompt（“标题”，“默认值”），不建议使用
通过表单元素进行输入

1.5 在HTML中使用JavaScript

具体代码如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<!-- JavaScript代码是在script标签内编写 -->
		<link rel="stylesheet" type="text/css" href="css/Day01cs.css"/>
		<!-- 3.当一个script标签引入外部的js文件，主要使用的是script标签中的src属性 -->
		<script type="text/javascript" src="js/Day01j.js">
			<!-- 2.当一个script标签用于引用外部的js文件，里面是不能写js代码的，即使写了也不会被执行 -->
		</script>
	</head>
	<body>
		<h1 class="main">h1标签
		<!-- 4.a标签里面的样式必须在a标签里面设置，否则不会显示 -->
		<a href="http://www.baidu.com">百度</a>
		</h1>
		<!-- 1.js代码编写的位置可以在head body(最好) body外 html外 -->
		<script type="text/javascript">
			alert("hello word!!!")
		</script>
	</body>
</html>

在此代码里使用了两个外部样式

1.css样式

代码：.main{
color: red;
}

2.js样式

代码：alert("okok");

1.6 JavaScript的核心构成

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

1.7 JavaScript的数据类型

1.基本数据类型

数值数据类型(number)
布尔类型(boolean)
未定义数据类型(undefined)
空数据类型(null)

2.引用数据类型

字符串类型（string）
Array数组类型
对象类型（Object）

具体代码如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			//声明一个变量 语法格式：var 变量名 = 值
			//变量名命名规范：可以是字母，数字，下划线，首个字母不能是数字，不能使用关键字
			//声明一个变量，用来存储学生姓名
			var stuName//1.声明一个变量
			stuName = "张玉"//2.给变量stuName进行赋值
			alert(stuName)//3.通过弹出框的方式将变量的值进行弹出
			document.write(stuName)//将变量的值打印在页面上
			document.write("<br />")//换行
			document.write(stuName)
			//经常用于代码调试 主要是通过控制台进行打印输出
			console.log(stuName)
			//在声明时直接给变量赋值
				var stuSex = "男"
				//同时声明多个变量
				var x = y = z = 10
				console.log(x)
				console.log(y)
				console.log(z)
				var isChecked = true
				//查看变量的数据类型，使用typeof
				console.log(typeof stuName)//string
				console.log(typeof x)//number
				console.log(typeof isChecked)//boolean
				//在js中，变量的数据类型跟该变量后面赋的值的类型有关
				//后面的值的类型是什么,那么该变量的数据类型就是什么
				//比如一个变量的值是字符串类型的，那么该变量就是字符串类型
			</script>
	</body>
</html>

1.8 混合计算数据类型

1.9 数据类型的转换

parselnt（String）

将字符串转换为整型数字，取整

例： parselnt（"12.22"）将字符串转换为整型值12

parseFloat (String)

将字符串转换为浮点型数字

例：parseFloat("12.22q")将字符串“12.22q”转换成浮点值12.22

具体代码如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			var num_1 = prompt("请输入第一个数字：")
			var num_2 = prompt("请输入第二个数字：")
			console.log(typeof num_1)
			console.log(typeof num_2)
			//parseInt:将一个字符串类型的转换成整数
			var result = parseInt(num_1) + parseInt(num_2)
			console.log(result)
			console.log(parseInt("12.8"))//parseInt()取整，不会四舍五入
			//parseFloat():将一个字符串类型的转换成小数
			console.log(parseFloat("12.5"))
		</script>
	</body>
</html>

辣椒沾辣酱啦

关注

0
点赞
踩
0

收藏

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

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

扫一扫