JavaScript基础
一、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 |