函数(pink老师课程笔记)

for循环

for (变量起始值;终止条件;变量变化量){ }

// 循环输出1-100
        for (let i = 1; i <= 3; i++) {
            console.log('月薪过哇')

        } 
        // 求出偶数的和
        /* let sum = 0
        for (let j = 1; j < 101; j++) {
            console.log(j)
            if (j % 2 === 0) {
                sum += j
            }
        }
        console.log(sum) */
        // 打印小心心
        /* for (let i = 0; i < 6; i++) {
            document.write('💛')
        } */

循环数组

// 循环数组
        let arr = ['wy', 'zs', 'zqw']
        for (let i = 0; i <= arr.length - 1; i++) {
            console.log(arr[i])
        } 

退出循环

for循环中,遇见continue直奔i++,后续不再执行

break结束循环

for和while

明确循环次数使用for,不明确whlie(true)

循环嵌套

for (let i = 0; i < 3; i++) {
            console.log(`第${i + 1}天`);
            for (let j = 0; j < 5; j++) {
                console.log(`记住第${j + 1}个单词`);
            }
        }

九九乘法表

for (let i = 0; i < 9; i++) {
            for (let j = 0; j <= i; j++) {
                let sum = 0
                sum = (i + 1) * (j + 1)
                document.write(`<span>${j + 1}x${i + 1}=${sum}</span>`)
            }
            document.write('<br>')
        }

数组(Array)

单变量中存储多个数据

  1. 数组的序号从‘0’开始
  2. 术语:元素、下表、长度(length)
  3. 按照一定顺序保存数据的数据类型

数组求和

// 数组求和
        let arr = [2, 6, 1, 7, 4]
        let sum = 0
        for (let i = 0; i < arr.length; i++) {
            sum += arr[i]
        }
        console.log(sum)

数组最值

let max = arr[0]
        for (let i = 0; i < arr.length; i++) {
            if (max < arr[i]) {
                max = arr[i]
            }
        }
        console.log(max)

数组操作

查——数组[下标]

改——数组[下标]=新值

arr[3] = 10

增——push/unshift

// 添加一个或多个元素在数组末尾并返回数组长度
        arr.push('red', 'green', 'orange')
        // 添加一个或多个元素在数组开头并返回数组长度
        arr.unshift('老师')

删——pop/shift/splice

//删除最后一个元素,并返回该元素的值
		arr.pop()
		//删除第一个一个元素,并返回该元素的值
        arr.shift()
        //从索引号为1的位置开始删除,共删除2个元素
        arr.splice(1, 2)

数组筛选

遍历旧数组,添加到新数组

let arr = [2, 4, 21, 43, 56, 76, 734, 768, 6, 9]
        let newArr = []
        for (let i = 0; i < arr.length; i++) {
            if (arr[i] >= 10) {
                newArr.push(arr[i])
            }
        }
        console.log(newArr) 

newArr.push(arr[i])——旧数组添加到新数组

冒泡排序

let arr = [21, 35, 62, 17, 25, 54]
        /* for (let i = 0; i < arr.length - 1; i++) {
            for (let j = 0; j < arr.length - i - 1; j++) {
                let num = 0
                if (arr[j] > arr[j + 1]) {
                    num = arr[j]
                    arr[j] = arr[j + 1]
                    arr[j + 1] = num
                }
            }
        } */
        // 升序排列
        arr.sort(function (a, b) {
            return (a - b)
        })
        console.log(arr)
        // 降序排列
        arr.sort(function (a, b) {
            return (b - a)
        })
        console.log(arr)
  • 外层循环:要走的趟数
  • 内层循环:交换的次数
  • arr.sort:默认升序排列

函数

// 函数封装
        function say99() {
            for (let i = 1; i < 10; i++) {
                for (let j = 1; j <= i; j++) {
                    let sum = j * i
                    document.write(`<li>${j}x${i}=${sum}</li>`)
                }
                document.write('<br>')
            }
        }
 // 函数调用
        for (let i = 0; i < 3; i++) {
            say99()
        }

代码复用

函数声明

function 函数名() {函数体}

命名规范

和变量名一致

小驼峰命名-getSum

前缀应为动词——can/has/is/get/set/load

函数调用

函数名()

函数一次声明多次调用

函数传参

function 函数名(参数列表) {函数体}

函数名(传递的参数列表)

function getSum(end) {
            let sum = 0
            for (let i = 1; i <= end; i++) {
                sum += i
            }
            console.log(`1到${end}累加和为${sum}`)
        }
getSum(50)

多个参数,逗号隔开

//  形参-形式参数
        function getSum(start, end) {
            let sum = 0
            for (let i = start; i <= end; i++) {
                sum += i
            }
            console.log(`${start}到${end}累加和为${sum}`)
        }
 // 实参-实际参数
        getSum(105, 504)

尽量保持形参和实参个数一致

  • 如果没给参数传过去,即getSum()——默认“0”

    function getSum(start=0, end=0) {
    

函数封装数组求和

// 学生总分
        function getSumScore(arr=[]) {
            // console.log(arr)
            let sum = 0
            for (let i = 0; i < arr.length; i++) {
                sum += arr[i]
            }
            console.log(sum)
        }
        getSumScore([12, 25, 12, 89, 66])
  • 给参数的默认值arr=[],防止getSumScore()报错
  • 实参可以是变量

函数返回值——return(关键字)

return 数据

// 返回值
        function fn() {
            return 20
        }
        // 相当于执行了  fn() =20
        // console.log(fn())
        // 类似于 let num=+prompt('请输入数字')
        let re = fn()
        console.log(re)

是fn()而不是fn

// 求和函数
        function getSum(x, y) {
            return x + y
        }
        let sum = getSum(1, 2)
        console.log(sum)
  • return后面的代码不会再执行
  • return不要换行
  • 函数没有return,则默认undefined
 // 求最值
        function getMax(arr = []) {
            let max = arr[0]
            for (let i = 0; i < arr.length; i++) {
                if (max < arr[i]) {
                    max = arr[i]
                }
            }
            return max
        }
        let max = getMax([12, 25, 66, 74, 23, 15])
        console.log(max)

return的返回值max给了getMax(),let将getMax()给了另一个max

两个max同名不同人

  • return返回值返回给了函数的调用者
  • 函数的调用者是函数名加小括号-getMax([12, 25, 66, 74, 23, 15])

返回多个值?——return [max,min]

补充

  1. 两个相同的函数后面的会覆盖前面的函数

  2. 实参和形参个数不一致

    如果形参过多 会自动填上undefined

    如果实参过多 那么多余的实参会被忽略 (函数内部有一个arguments,里面装着所有的实参)

  3. 函数一旦碰到return就不会在往下执行了 ,函数的结束用return

break结束循环和switch,它不会结束函数

作用域

可用性的代码范围

全局作用域

局部作用域

全局变量和局部变量

根据作用域的不同,可分为全局变量和局部变量

// 全局
        let num = 10
        function fn() {
            console.log(num)
        }
// 局部
        function fun() {
            let str = 'wuyao'
        }
        console.log(str) // str is not defined

变量访问原则:在能够访问到的情况下 先局部 ,局部没有再找全局(就近原则)

let num = 10
        function fn() {
            let num = 20
            console.log(num)
        }
 fn()

函数的形参可以看作局部变量

匿名函数

没有名字的函数, 无法直接使用

使用方式

  • 将匿名函数赋值给一个变量,并且通过变量名称进行调用 我们将这个称为函数表达式
// 匿名函数
        let fun = function () {
            console.log('吴瑶吃8个大包子');
        }
        fun()

具名函数的调用位置可以写到任何位置,函数表达式必须先声明后调用

  • 立即执行函数(匿名函数自执行)——无需调用,立即执行

    (function () {
                console.log(11)
            })()
    

    (function(x,y){})(1,2)

    多个立即执行函数之间使用分号隔开

    (function () {
                let num = 10
            })();
    (function () {
                let num = 20
            })()
    

    两个num互不影响

    第二种写法

    (function () {
                console.log(11)
            }())
    

    (function(x,y){}(1,2))

避免全局变量之间的污染

综合案例

用户输入秒数,转化为时分秒

 // 用户输入
        let miao = +prompt('请输入秒数')
 // 封装函数
        function getTime(t) {
            // 转换(时分秒)——计算公式
            let h = parseInt(t / 60 / 60 % 24)
            let m = parseInt(t / 60 / 60)
            let s = parseInt(t / 60)
 // 补零(记得重新赋值),h为number型
            h = h < 10 ? '0' + h : h
            m = m < 10 ? '0' + m : m
            s = s < 10 ? '0' + s : s
            return `${t}秒的转换结果为${h}小时${m}分钟${s}秒`
        }
        let str = getTime(miao)
        document.write(str)
  • 函数内部的声明let h = parseInt(t / 60 / 60 % 24)
  • 数字补零时记得重新赋值h = h < 10 ? '0' + h : h
  • miao——实参;t——形参。不要把miao直接给函数
  • 使用return
  • 函数调用时:let str = getTime(miao)

逻辑中断

function getSum(x, y) {
            x = x || 0
            y = y || 0
            return x + y
        }
        let str = getSum(1, 2)
        console.log(str)
  • 类似于默认值的写法

只存在与&&和||

&&——一假全假 ||——一真全真

// &&都为真,则返回最后一个真值(22)
        console.log(11 && 22)
// ||都为真,则返回第一个真值(11)
        console.log(11 || 22)
  • ||都为假,则返回最后一个假

转换为Boolean型

boolean( )

记忆: "、0、undefine、 null、 false、 NaN转换为布尔值后都是false,其余则为true

// false
console.log(Boolean(undefined))  
// false
console.log(Boolean(null))
// undefined
console.log(undefined && 20)
// 3
 console.log(null + 3)
// NaN
 console.log(undefined + 3)
// true
 console.log(null == undefined)
// false
console.log(null === undefined)

作业练习

目标: 封装一个函数,可以求任意数组的和 或 平均值

要求:

  • 函数可以传递2个参数,比如 handleData(arr, true) handleData 处理数据的意思
    • 参数一: 接受实参传递过来的数组
    • 参数二: 布尔类型 如果是true或者不传递参数 是求和操作, 如果传递过来的参数是 false 则是求平均值
function handleData(arr, flag = true) {
            let sum = 0
            for (let i = 0; i < arr.length; i++) {
                sum += arr[i]

            }
            if (flag) {
                return sum
            } else {
                return sum / arr.length
            }
        }
        document.write(handleData([1, 2, 3], true))
        document.write(handleData([1, 2, 3], false))

需求: 封装 some 函数查看数组是否存在某个元素 。

  • 要传递2个参数 元素、数组
  • 如果数组存在元素则返回true,如果没有存在元素就返回 false
function some(element, arr = []) {
            let flag = false
            for (let i = 0; i < arr.length; i++) {
                if (element === arr[i]) {
                    flag = true
                    break
                }
            }
            return flag
        }
        document.write(some(4, [7, 5, 2, 4, 0]))
        document.write(some(4, [7, 5, 2, 3, 1]))
  1. 声明flag
  2. 三等===
  3. if语句中使用break
  4. return的书写位置
posted @ 2023-11-10 16:40  齐嘉树  阅读(19)  评论(0编辑  收藏  举报