theluyuan/webveuje
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
1c003714c3
webveuje/javascriptpress/2.javascript基础.md

284 lines
7.5 KiB
Markdown
Raw Normal View History

js
2020-12-31 09:56:58 +08:00
# javascript 基础
## 函数
上节中提到了函数 但是没有仔细说 这节仔细讲一下函数
### 函数声明
定义变量有关键字var 定义函数也有一个 但是在定义函数的时候不叫定义函数 而叫声明函数 意思是一样的 只是叫法不同
### 语句
在说明函数之前 先看一下什么是语句
语句就是一个对浏览器要做的事情 比如上节中的`var name = "name"` 这就是一个语句
- 关键字 var 告诉浏览器 定义一个变量
- 名字是 var后面跟着的 是name
- 然后 = 赋值 将“name” 赋值给name这个变量
这就是一条语句
```javascript
var name = "啦啦啦";
var age = 18;
```
上面的例子有两条语句 语句后面要用;结束 但是在javascript中 解释器会自动判断语句的结束 但是在特殊时候可能并不太准确 所以最好可以添加分号
```javascript
var name = "啦啦啦"
var age = 18
```
不加分号跟上面添加分号的效果相同
在javasctipt中 所有告诉浏览器执行的都叫语句
```javascript
var name; 定义一个变量 名字叫name
name = "啦啦啦"; 将 啦啦啦 这个字符串 赋值给name
"啦啦啦"; 创建一个内容是 啦啦啦 的字符串
```
### 创建函数
说完语句然后在来看看 如何创建函数
```javascript
function name(){
var name = "啦啦啦";
var age = 18;
alert(name);
}
```
上面的例子中
- function 声明函数的关键字 后面跟名字
- name 函数的名字 命名规则跟变量是一样的
- () 下面再说
- {} 中间就是函数要执行的语句
函数就是包含这些东西
但是函数如何使用呢？
```html
<html>
<head>
<title>javascript演示</title>
<script>
function hello(){
var name = "啦啦啦";
var age = 18;
alert(name);
}
</script>
</head>
<body>
<button onClick="hello()">点我运行hello这个函数</button>
</body>
</html>
```
定义了一个hello的函数 内容是弹出name的值 html中有一个button用于调用这个函数 如何调用呢？
在button中看到一个 onClick 属性 值是hello() 在html中 几乎所有元素都有onClick属性 这个属性的值是要运行的javascript的函数名字 + ()
为什么要加()呢 因为在变量那边说了 如果只有名字的话是取值 函数也是一样的 声明函数之后 用函数名字的话 只会拿到函数的内容 想要执行这个函数的代码内容的话 需要在函数名字后面加上() 表示运行这个函数
这是在html中使用函数 但是还有一个疑问 声明函数的时候函数的代码内容会不会运行呢？ 带案是不会 因为声明的时候只会把函数代码内容经过解释器处理赋值给hello这个变量里面
声明的函数也是一个变量 只是关键字不一样 用的是function 因为function 声明的都是函数 所以在用的时候都会说是声明一个函数 而不是声明一个名字为 hello的变量 值是一个函数
## 函数传参
在上面说了如何声明函数 和函数如何调用 那么来说一下函数如何传参
什么是参数呢？ 在生活中 比如我们要做一些事情 有些事情需要一些参数 比如你要去 超市买东西 结算的时候 收银员需要告诉你多少钱 你才能给他多少钱 而且在给的时候还要考虑带没带够钱或者能不能支付的起
下面就实现一个这个函数
- 告诉函数现在有多少钱
- 告诉函数需要付多少钱
- 函数需要判断现在的钱够不够
- 如果足够告诉我们购买后还剩多少钱
## 预备知识
### 数据类型
在javascript中 有很多类型的数据 前面说了有 数字和字符串 (number string)还有其他的
- string
- number
- boolean
- function
- undefined
- object
2
2021-01-04 09:38:03 +08:00
### 检测数据类型
如何检测 javascript中有一个typeof
例如
```javascript
var name = "啦啦啦";
alert(typeof name);
```
![image-20201231104704137](2.javascript基础.assets/image-20201231104704137.png)
```javascript
var age = 18;
alert(typeof age);
```
![image-20201231104814391](2.javascript基础.assets/image-20201231104814391.png)
js
2020-12-31 09:56:58 +08:00
#### boolean
2
2021-01-04 09:38:03 +08:00
js
2020-12-31 09:56:58 +08:00
只有 true 和 false 两个值 一个是真 一个是 假 就是他是不是的意思
比如 1 + 1 = 2 正确 就是true
在比如 1+1 = 3 错误 所以是fasle
2
2021-01-04 09:38:03 +08:00
但是在javascript中 判断两个是否相等是 == 就是两个等于号 一个等号的时候是赋值
例如
```javascript
var bool = true;
alert(typeof bool);
js
2020-12-31 09:56:58 +08:00
2
2021-01-04 09:38:03 +08:00
alert(typeof (1+1==2));
```
这两个都会弹出
![image-20201231105243850](2.javascript基础.assets/image-20201231105243850.png)
#### function
就是定义的函数
```javascript
function hello(){
}
alert(typeof hello)
```
![image-20201231105424140](2.javascript基础.assets/image-20201231105424140.png)
#### undefined
js
2020-12-31 09:56:58 +08:00
2
2021-01-04 09:38:03 +08:00
所有创建没有赋值的变量或属性都是undefined undefined类型的值只有一个 就是undefined
例如
```javascript
var age;
alert(typeof age);
alert(typeof undefined);
```
js
2020-12-31 09:56:58 +08:00
2
2021-01-04 09:38:03 +08:00
![image-20201231105746998](2.javascript基础.assets/image-20201231105746998.png)
#### array 数组
js
2021-01-04 14:13:00 +08:00
虽然说是数组 但是内容不只能是数字 只是索引是数字 就跟高中的集合一样
举个例子
```javascript
var list = ["苹果","香蕉","橘子"];
// 这是一个内容都是水果的数组
如何获取第一个苹果呢？
alert(list[0])
// 获取剩余的两个
alert(list[1])
alert(list[2])
// 数组的索引是从0 开始的 就是[0] 是里面的第一个 不是从1开始了
```
#### 对象
对象跟数组差不多 但是是用字母索引的
```javascript
var dog = {
name: "dog",
age: 7,
duak: fucntion (){
alert("汪")
}
}
alert(dog.name)
alert(dog.age)
dog.duak()
```
对象使用属性内容是直接 对象.属性就行 属性名必须遵循命名规范 值可以是任意类型
js
2020-12-31 09:56:58 +08:00
上节中说了数字之间的加法 字符串也可以相加 但是字符串的相加是直接拼接起来 字符串与数字相加也会将字符串与数字拼接起来 然后返回一个字符串 (类型后面会讲)
例如
```javascript
var name = "我的名字是:" + "啦啦啦"
var age = "我的年龄是:" + 18
```
- name的值是 我的名字是:啦啦啦
- age的值是 我的年龄是:18
就是这么简单的拼接
#### 条件语句
if else
这个是一个条件语句 就是判断条件是否成立 如果成立会做什么事情 如果不成立要做什么事情
js
2021-01-04 14:13:00 +08:00
举个例子
```javascript
var tiaojian = true;
if(tiaojian){
alert("成立")
} else {
alert("不成立")
}
```
如果没有else
```javascript
var tiaojian = true;
if(tiaojian){
alert("成立")
}
```
如果有多个条件
```javascript
var num = 10
if(num > 10){
alert("大于10")
}else if(num < 10){
alert("小于10")
}else {
alert("等于10")
}
```
如果没有条件成立
```javascript
var num = 10;
if(num > 10){
alert("大于10")
}
alert("匹配结束回到这")
```
#### 函数传参
```javascript
function people(name,age){
alert("我的名字:" + name + "我的年龄:" + age);
}
people("啦啦啦", 18)
```
只需要在函数后面的括号定义几个名字 而且需要遵循命名规范
### 实现上面的题目
js
2020-12-31 10:22:15 +08:00
```javascript
var num = 100;
var shop = 80;
function buy(num,shop){
if(num - shop < 0 ){
alert("买不起")
}else{
var shengyu = num - buy
alert("可以购买，剩余" + shengyu)
}
}
buy(num,shop)
```
js
2021-01-04 14:13:00 +08:00
js
2020-12-31 10:22:15 +08:00
## 作业
- 创建一个对象 用alert 弹出它的所有属性
- 创建一个数组 用alert弹出他所有的元素
- 创建一个function 传入两个参数 弹出这两个参数相乘的结果
- 创建一个function 传入两个数 弹出最大的那个数
js
2021-01-04 14:13:00 +08:00
Reference in New Issue Copy Permalink