JS基础篇

瞳眬

已于 2024-08-07 19:42:45 修改

阅读量902

点赞数 40

分类专栏：前端开发文章标签： javascript 开发语言 ecmascript

于 2024-08-07 15:41:38 首次发布

本文链接：https://blog.csdn.net/2301_79614134/article/details/140989021

版权

前端开发专栏收录该内容

15 篇文章 0 订阅

订阅专栏

JavaScript基础

一、JavaScript介绍
二、语句
三、数组增删改查
- 1.增删改查
四、函数
- 1.使用函数
- 2.匿名函数
五、对象
- 1.增删改查

一、JavaScript介绍

1.JavaScript 是什么

JavaScript 是一种高级的、解释执行的编程语言，主要用于网页的交互性和动态内容的创建

2. JavaScript 书写位置

（1）内部样式
<script>标签写在</body>上面

<body>
	......
	<script>
		alert('Hello')
	</script>
</body>

（2）外部样式
代码写在以.js结尾的文件里
通过<script>标签，引入到html页面中

<body>
	......
	<srcipt src="1.js"></srcipt>
	<!-- 引入外部样式时<script>标签中间代码会被忽略！！！ -->
</body>

（3）内联样式
代码写在标签内部

<body>
	<button onclick="alert('Hello')">按钮</button>
</body>

3.输入输出语法

（1）输出语法

<script>
//语法1
	document.write('内容')
	//向<body>内输出内容
//语法2
	alert('内容')
	//页面弹出警告对话框
//语法3
	console.log('内容')
	//控制台输出语法，程序员调试使用
</script>

（2）输入语法

<script>
	prompt('请输入你的年龄')
	//显示一个对话框，对话框中包含一条文字信息，用来提示用户输入文字
</script>

4.变量与常量

<script>

	// let 变量名 = 赋值
	let age = 18
	 
	// let 数组名 = [数据1,数据2......,数据10]
	// names.length代表数组长度
	let names = ['小明','小红','小亮','小刚']

	// const 常量名 = 赋值
	// const 声明的值不可改变
	const ID = 123456
</script>

二、语句

1.if语句

<script>
	// if语句
	if (条件1) {
		// 代码1
	} else if (条件2) {
		// 代码2
	} else if (条件3) {
		// 代码3
	} else {
		// 代码4
	}
</script>

2.三元运算符

<script>
	条件 ? 满足条件时执行 : 不满足条件时执行
</script>

3.switch语句

<script>
	switch(数据){
		case 值1 :
			// 代码1
			break 
		case 值2 :
			// 代码2
			break
		default :
			// 代码3
			break
	}
</script>

4.whlie循环

<script>
	// break是跳出循环 continue是结束本次循环
	while(循环条件) {
		// 要循环的代码（循环体）
	}
</script>

5.for循环

<script>
	for(变量起始值,循环条件,每次循环变化量){
		// 循环的代码（循环体）
	}
</script>

三、数组增删改查

1.增删改查

操作数组	语法	说明
增	数组. push() 数组. unshift()	将一个或多个元素添加到数组的末尾 `例：arr.push('red')` 将一个或多个元素添加到数组的开头 `例：arr.unshift('red')`
删	数组. pop() 数组. shift() 数组. splice()	数组中删除最后一个元素 `例：arr.pop()` 数组中删除第一个元素 `例：arr.shift()` 删除指定元素 `例：arr.splice(起始位置,删除几个元素)`
改	数组[下标] = 新值	重新赋值 `例：arr[1]='red'`
查	数组[下标]	查询数组数据 `例：arr[1]`

四、函数

1.使用函数

<script>
	function userNames(name1=0,name2=0){
		// 代码
		return 返回值
	}
	userNames('小红','小明')
</script>

2.匿名函数

<script>
	// 语法
	let fn = function () {
		// 执行代码
	}
	//调用函数
	fn()

	//立即执行函数
	//方法1
	(function () {执行代码})();
	//方法2
	(function () {执行代码} ());
	//多个立即执行函数要用 ; 隔开，要不然会报错
</script>

五、对象

<script>
	let 对象名 = {
		属性名 : 属性值,
		方法名 : 函数 
	}
</script>

1.增删改查

操作对象	语法	例子
增	对象名.新属性名 = 新值	names.age = 18
删	delete 对象名.属性名	delete names.age
改	对象.属性 = 值	names.age = 18
查	对象.属性	names.age