JavaScript | JavaScript入门知识

JavaScript编写位置

  • 我们目前学习的JS全都是客户端的JS,也就是说全都是需要在浏览器中运行的,所以我们我们的JS代码全都需要在网页中编写。
  • 我们的JS代码需要编写到<script>标签中。
  • 我们一般将script标签写到head中。(和style标签有点像)(但是不一定)
  • 属性:
    • type:默认值text/javascript可以不写,不写也是这个值。
    • src:当需要引入一个外部的js文件时,使用该属性指向文件的地址。
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		
		<!--
			可以将js代码编写到外部js文件中,然后通过script标签引入
			写到外部文件中可以在不同的页面中同时引用,也可以利用到浏览器的缓存机制
			推荐使用的方式
		-->
		<!--
			script标签一旦用于引入外部文件了,就不能在编写代码了,即使编写了浏览器也会忽略
			如果需要则可以在创建一个新的script标签用于编写内部代码
		-->
		<script type="text/javascript" src="js/script.js"></script>
		<script type="text/javascript">
			alert("我是内部的JS代码");
		</script>
		
		<!--
			可以将js代码编写到script标签	
		<script type="text/javascript">
			
			alert("我是script标签中的代码!!");
			
		</script>
		-->
	</head>
	<body>
		
		<!--
			可以将js代码编写到标签的onclick属性中
			当我们点击按钮时,js代码才会执行
			
			虽然可以写在标签的属性中,但是他们属于结构与行为耦合,不方便维护,不推荐使用
		-->
		<button onclick="alert('讨厌,你点我干嘛~~');">点我一下</button>
		
		<!--
			可以将js代码写在超链接的href属性中,这样当点击超链接时,会执行js代码
		-->
		<a href="javascript:alert('让你点你就点!!');">你也点我一下</a>
		<a href="javascript:;">你也点我一下</a>
		
	</body>
</html>

Hello World

  • 创建一个html文件。
  • 在html文件的head标签中创建一个script标签,并编写如下代码。
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<!--JS代码需要编写到script标签中-->
		<script type="text/javascript">
			
			/*
			 * 控制浏览器弹出一个警告框
			 * alert("哥,你真帅啊!!");
			 */
			
			/*
			 * 让计算机在页面中输出一个内容
			 * document.write()可以向body中输出一个内容
			 * document.write("看我出不出来~~~");
			 */
			
			/*
			 * 向控制台输出一个内容
			 * console.log()的作用是向控制台输出一个内容
			 * console.log("你猜我在哪出来呢?");
			 */
			
			alert("哥,你真帅啊!!");
			document.write("看我出不出来~~~");
			
			console.log("你猜我在哪出来呢?");
	
		</script>
	</head>
	<body>
	</body>
</html>

严格区分大小写

  • JavaScript是严格区分大小写的,也就是abc和Abc会被解析器认为是两个不同的东西。
  • 所以在编写上边的HelloWorld时,一定要注意区分大小写。

JavaScript注释

  • 注释中的内容不会被解析器解析执行,但是会在源码中显示,我们一般会使用注释对程序中的内容进行解释。
  • JS中的注释和Java的的一致,分为两种:
    • 单行注释://注释内容
    • 多行注释:/*注释内容*/
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			/*
			 	多行注释
			 	JS注释
			 	多行注释,注释中的内容不会被执行,但是可以在源代码中查看
			 		要养成良好的编写注释的习惯,也可以通过注释来对代码进行一些简单的调试
			 */
			
			//单行注释
			//alert("hello");
			//document.write("hello");
			console.log("hello"); //该语句用来在控制台输出一个日志
			
			/*
			 * 1.JS中严格区分大小写
			 * 2.JS中每一条语句以分号(;)结尾
			 * 		- 如果不写分号,浏览器会自动添加,但是会消耗一些系统资源,
			 * 			而且有些时候,浏览器会加错分号,所以在开发中分号必须写
			 * 3.JS中会忽略多个空格和换行,所以我们可以利用空格和换行对代码进行格式化
			 * 
			 */
			
			alert("hello");

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

JavaScript标识符

  • 所谓标识符,就是指变量、函数、属性的名字,或函数的参数

  • 标识符可以是按照下列格式规则组合起来的一或多个字符:

    • 第一个字符必须是一个字母、下划线( _ )或一个美元符号( $ )
    • 其他字符可以是字母、下划线、美元符号数字
  • 按照惯例,ECMAScript 标识符采用驼峰命名法

  • 但是要注意的是JavaScript中的标识符不能是关键字保留字符

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			/*
			 * 标识符
			 * 	- 在JS中所有的可以由我们自主命名的都可以称为是标识符
			 * 	- 例如:变量名、函数名、属性名都属于标识符
			 * 	- 命名一个标识符时需要遵守如下的规则:
			 * 		1.标识符中可以含有字母、数字、_、$
			 * 		2.标识符不能以数字开头
			 * 		3.标识符不能是ES中的关键字或保留字
			 * 		4.标识符一般都采用驼峰命名法
			 * 			- 首字母小写,每个单词的开头字母大写,其余字母小写
			 * 			helloWorld xxxYyyZzz
			 * 
			 * 	- JS底层保存标识符时实际上是采用的Unicode编码,
			 * 		所以理论上讲,所有的utf-8中含有的内容都可以作为标识符
			 */
			/*var if = 123;
			
			console.log(if);*/
			
			
			//千万不要这么用
			var 锄禾日当午 = 789;
			console.log(锄禾日当午);
		</script>
	</head>
	<body>
	</body>
</html>

JavaScript关键字和保留字符

  • 关键字

  • 保留字符

  • 其他不建议使用的标识符

JavaScript变量

  • 变量的作用是给某一个值或对象标注名称。

  • 比如我们的程序中有一个值123,这个值我们是需要反复使用的,这个时候我们最好将123这个值赋值给一个变量,然后通过变量去使用123这个值。

  • 变量的声明:

    • 使用var关键字声明一个变量。
    • var a;
  • 变量的赋值:

    • 使用=为变量赋值。
    • a=123;
  • 声明和赋值同时进行:

    • var a = 123;
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			/*
			 * 字面量,都是一些不可改变的值
			 * 		比如 :1 2 3 4 5 
			 * 		字面量都是可以直接使用,但是我们一般都不会直接使用字面量
			 * 
			 * 变量    变量可以用来保存字面量,而且变量的值是可以任意改变的
			 * 		变量更加方便我们使用,所以在开发中都是通过变量去保存一个字面量,
			 * 		而很少直接使用字面量
			 * 		可以通过变量对字面量进行描述
			 */
			
			//声明变量
			//在js中使用var关键字来声明一个变量
			var a;
			
			//为变量赋值
			a = 123;
			a = 456;
			a = 123124223423424;
			
			//声明和赋值同时进行
			var b = 789;
			var c = 0;
			
			var age = 80;
			
			console.log(age);
			
			
		</script>
	</head>
	<body>
	</body>
</html>
posted @ 2023-07-23 10:37  张Zong在修行  阅读(7)  评论(0编辑  收藏  举报