函数
函数
- 有一点类似于变量，因为都是一个盒子，但是完全不同
- 变量这个盒子内部存放某一个具体的值 比如：100，'QF001','qwe'
- 函数这个盒子内部不是为了窜发那个某一个具体的值，而是为了存放某一段需要重复多次出现的代码
var box=100
box ='QF001' //将box内部重新赋值一个字符串，QF001，和之前的数字100完全没有任何关系
console.log(box) //QF001
函数的定义与调用
定义(创建)
-
语法1：function 函数名（参数：非必传，暂时不写）{函数被调用的那时候需要执行的某一段}
调用（使用）
函数名（）
//如果一个函数只定义，而不调用，那么永远不会执行
//1.函数定义
function box(){
console,log(1+1)
}
//2.函数调用
box()
-
函数的语法
- 语法1：推荐使用
function 函数(){} ->声明式定义
2.语法2：
var 函数名 =function(参数：非必传，暂时不写){} ->赋值式定义
调用时，不管如何定义，都是使用函数名（）
function fn1(){
console.log('我是fn1函数，我被调用了')
}
var fn2 function(){
console.log('我是fn2 函数，我被调用了')
}
fn1()
fn2()
函数的参数
为什么要有参数
为了我让函数的功能更加灵活，不会导致函数的功能太过于死板
- 形参 - 函数定义时小括号中书写的内容，相当于在函数中创建了一个变量 - 具体的值有实参提供，如果实参没有传递对应的内容，那么值为undefined
- 实参
- 函数调用时小括号书写的内容，这里书写的内容，会传递给对应的形参
- 注意：一个函数可以接受多个形参和实参，多个形参于实参使用，间隔 - 虽然形参和实参的数量没有限制，但是如果太多会导致代码难以阅读，所以不推荐多写
基础示例
function fn(a){
console.log(a)
}
fn('QF001')
fn(10086)
//调用fn函数的时候，书写了一个实参就是'QF001'
//然后会按照规则传递给对应的形参就是形参
// 那么也就相当于在fn函数中创建了一个变量并赋值为'QF001'
// 这样的好处是在函数中的形参啊，支部股东，那么函数的功能就更加灵活
多个形参和实参
var fn = function (a, b, c) {
console.log(a)
console.log(b)
console.log(c)
fn(100, 200, 300)
//调用 fn 函数的时候, 书写了 三个 实参 分别是 100 200 300
//然后会按照规则 传递给 对应的 形参 (按照书写的顺序)
// 第一个实参 -> 第一个形参
//第二个实参 -> 第二个形参
// 以此类推
// 所以当前案例中
// a === 100
// b === 200
// c === 300
实参多，形参少
- 第一个实参会按照顺序给第一个形参, 并以此类推
- 多写的实参, 没有对应的形参接收, 那么在函数中暂时无法使用
// function fn1(a) {
console.log(a)
}
fn1(100, 200, 300)
实参少，形参多
- 第一个实参会按照顺序给第一个形参, 并以此类推
- 但是 多写的 形参没有对应的实参传递具体的值
- 所以相当于 变量定义了但没有赋值, 所以他们的值都是 undefined
var fn2 = function (a, b, c, q, w, e, r, t) {
console.log(a, b, c, q, w, e, r, t)
}
fn2('QF001')
- 函数中 参数可以具有默认值 (ES6 的新写法)
//ES5 的写法
var fn3 = function (a, b) {
if (b === undefined) {
b = 'fn3 函数中 形参 b 的默认值'
}
// if (!b) b = 'fn3 函数中 形参 b 的默认值' // 简化, 但是有漏洞/bug
console.log(a, b)
}
fn3('QF_FN3', false)
//ES6的写法
function fn4 (a, b = '默认值') {
console.log(a, b)
}
fn4('QF_FN4', undefined)
函数的返回值
- 每一个函数调用完毕后 都会有一个结果(值), 默认为 undefined
- 如果想要更改那么我们需要借助一个 关键字 return
- return 的后边可以跟 任何的数据, 包括表达式
- 注意:
- 函数中 return 只会生效一个, 因为 return 具有中断函数的能力
- 所以一般 return 会写在函数的末尾
- 如果想要写在函数的 开头, 必须结合 分支语句 ```js function fn () {} // 将 fn 函数的 执行/调用 结果, 存到一个变量 res 中 var res = fn() console.log(res) // undefined console.log(fn()) // undefined
function fn () {
// return '书写你要返回的内容'
// return 1 + 1 // 函数中 return 只会生效一个
// }
// // 将 fn 函数的 执行/调用 结果, 存到一个变量 res 中
var res = fn()
console.log(res) // undefined
console.log(fn()) // undefined
```js
return 具有中断函数的能力
function fn() {
console.log(1)
console.log(2)
console.log(3)
return '你好, 你看还会不会打印'
}
fn()
return 结合 分支语句
function fn (bo) {
// 当我传递参数为 true 正常执行函数功能, 否则, 不执行
if (bo === false) return
console.log('函数的功能正常执行')
}
// fn(false)
fn(true)
JS案例
1.封装一个函数, 计算出两个数字的最大公约数
逻辑:
书写一个函数
需要两个参数
需要返回值, 返回最大的公约数
//基本版
function fn(x,y){
var min = x > y ? y : x
var num = 0 //用于存储最大公约数
//拿到1~较小值 之间的所有数字
for(var i = min ; i >= 1; i--){
//寻找x和y的公约数
if(x % i === 0 && y % i=== 0){
//console.log(i)
// 当 num 的值 小于 i 的时候, 将 i 的存储到 num, 因为我们要找的是 最大公约数
if (num < i) {
num = i
}
}
}
// return '最大公约数'
return num
}
//优化版
function fn(x, y) {
var min = x > y ? y : x
// 拿到 1~较小值 之间的所有数字
for (var i = min; i >= 1; i--) {
// 寻找 x 和 y 的公约数
if (x % i === 0 && y % i === 0) {
// console.log(i)
/**
* 当前 分支语句执行的时候, 代表找到了 公约数
* 顺序中 第一个就是最大公约数, 所以当前分支第一次执行完毕后, 就等于找到了最大公约数
*
* 然后直接 return i 将最大公约数返回给外部, 并且函数到此结束, 后续不在运行
*/
return i
}
}
}
var sum1 = fn(12, 8)
var sum2 = fn(20, 100)
var sum2 = fn(200, 100)
console.log(sum1)
console.log(sum2)
2. 封装一个函数, 用于判断一个 数字是不是质数
/**
* 逻辑:
* 1. 封装一个函数
* 2. 需要一个参数
* 3. 需要返回值, 并且是布尔值
*/
function fn(n) {
var num = 0 // 用于作为一个计数器
// 1. 找到 2~n-1 之间的所有数字
for (var i = 2; i < n; i++) {
// 2. 找有没有能够和 形参n 完整整除的数字
if (n % i === 0) {
// 3. 当分支执行的时候, 修改 num 的值 (修改计数器)
num++
}
}
// if (num === 0) {
// // 是质数
// return true
// } else {
// // 不是质数
// return false
// }
return num === 0
}
var res = fn(11)
console.log(res)
对象
- 属于引用型数据（复杂数据类型）
- 只是一个存储基本数据类型的集合
- 对象的花括号中书写的不是代码, 而是键值对格式的数据
-
键值对 --- key/value --- 属性名:属性值
-
冒号左边的统称为: 键/key/属性名 右边统称为: 值/value/属性值
-
对象这个数据结构 将来开发中经常会使用 用户详情 商品详情 文章详情
var obj = {
num: 1,
sum: 10086,
name: '张三',
age: 18,
bo1: true,
bo2: false
}
console.log(obj)
对象的创建
对象的创建
var obj1 = {} // 字面量的方式创建
console.log(obj1)
var obj2 = new Object() // 内置的构造函数的方式创建
console.log(obj2)
对象的操作（增删改查）
点语法
var obj = {
name: '张三',
id: 'QF001'
}
console.log('原本的对象: ', obj)
// 2.1 增 对象名.新的属性名 = 对应的属性值
// obj.age = 18
// 2.2 删 delete 对象名.要删除的属性名
// delete obj.id
// 2.3 改 对象名.要修改属性值的属性名 = 新的属性值
// obj.name = '张三丰'
// console.log('操作后的对象: ', obj)
// 2.4 查 对象名.要查询的属性名 会得到对应的属性值
console.log(obj.name)
中括号法
var obj = {
name: '张三',
id: 'QF001'
}
