JS_函数_预解析

最新推荐文章于 2022-06-21 21:09:07 发布

柠檬养乐多.

最新推荐文章于 2022-06-21 21:09:07 发布

阅读量256

点赞数

文章标签： javascript 开发语言前端 html

本文链接：https://blog.csdn.net/ysj94s7/article/details/122896216

版权

本文介绍了JavaScript的基础知识，包括在100-200之间输出质数，组合数计算，绘制菱形点阵，以及函数的定义、调用、参数传递和个数处理。深入探讨了函数的预解析机制，展示了如何通过预解析避免常见错误，并提供了多个实际编程练习，如加密函数、求和、最大值和最小值计算等。此外，还讨论了预解析可能导致的错误情况及面试题解析，帮助读者巩固理解。

摘要由CSDN通过智能技术生成

01-练习

a.输出100-200之间的质数

// 100 - 200

// - 质数

for (var j = 100; j <= 200; j++) {

// var n = j

// 计数

var count = 0

for (var i = 2; i < j; i++) {

if (j % i === 0) {

// 计数增长

count++

// 结束循环

break

}

if (count === 0) {

console.log(j)

}

b.0-3之间的组合数

// 0 - 3 组合数

for (var i = 0; i <= 3; i++) {

for (var j = 0; j <= 3; j++) {

// console.log(i * 10 + j)

var n = i * 10 + j

if (n < 10) {

n = '0' + n

} else {

n = '' + n

}

console.log(n)

}

c.点阵（菱形）

***

*****

*******

*********

*******

*****

***

var n = 4

for (var i = 0; i <= n; i++) {

for (var j = 0; j < n - i; j++) {

document.write(' ')

}

for (var j = 0; j < i * 2 + 1; j++) {

document.write('*')

}

document.write('<br />')

}

for (var i = 0; i < n; i++) {

for (var j = 0; j <= i; j++) {

document.write(' ')

}

for (var j = 0; j <= 7 - (i * 2) - 1; j++) {

document.write('*')

}

document.write('<br />')

}

02-函数

含义，用法

// 函数

// - 为了方便减少代码量

// fn -> 名字盒子

// 定义

function fn() {

for (var i = 0; i < 10; i++) {

for (var j = 0; j <= i; j++) {

document.write('*')

}

document.write('<br />')

}

// 调用

fn() // 打开盒子

fn()

// fun() // 找不到会提示

03-函数定义阶段

// 函数定义

// function 关键字去计算机内存中申请一块空间

// fn 命名和变量名规范一样

// () 参数用来使用不固定值

// {} 代码块用来放代码

// 声明式函数

function fn() { }

// 赋值式函数

var fun = function () { }

04-函数的调用阶段

有定义才能调用

没有定义调用会报错，提示你没找到这个东西

声明式函数在哪里调用都可以，赋值式函数只能在定义之后调用

// 调用

fn()

function fn() {

console.log('fn 函数')

}

// 调用

// fn()

// 调用

fun()

var fun = function () {

console.log('fun 函数')

}

// 调用

// fun()

05-参数

参数

- 当某个值不固定就使用参数

- 形参：函数定义（别名随意起名字符合命名规范就行）

- 实参：函数调用（必须是一种真实数据类型：number string boolean null undefined function）

- 参数个数：没有限制，实参和形参对应赋值

- 实参过多没什么问题，只是不接收

- 形参多没有值的是undefined

function fn(a, b) {

// a = 12

// b = 5

// c = undefined

console.log(a + b)

}

fn(12, 5, 100)

06-参数练习

function fn(n, m) {

for (var j = n; j <= m; j++) {

// var n = j

// 计数

var count = 0

for (var i = 2; i < j; i++) {

if (j % i === 0) {

// 计数增长

count++

// 结束循环

break

}

if (count === 0) {

console.log(j)

}

// fn(100, 200)

fn(50, 100)

07-参数个数过多

情况1

arguments

- 参数集合

- 只能在函数内使用

function fn() {

// console.log(arguments) // 所有数值

// console.log(arguments.length) // 长度

// 单独看某一个数值

// - 下标从0开始

// console.log(arguments[2])

var res = 0

// res += arguments[0]

// res += arguments[1]

// res += arguments[2]

// res += arguments[3]

// res += arguments[4]

// res += arguments[5]

// console.log(arguments.length)

for (var i = 0; i < arguments.length; i++) {

res += arguments[i]

}

console.log(res)

}

fn(12, 5, 7, 99, 103, 1)

fn(12, 5, 7, 99, 103)

fn(100, 200, 300)

情况2（求最大，最小值）

<script>

function fn() {

var max = arguments[0]

for (var i = 1; i < arguments.length; i++) {

if (max < arguments[i]) {

max = arguments[i]

}

console.log(max)

}

fn(12, 5, 7, 99, 103, 1)

fn(12, 5, 7, 99, 103, 999)

fn(100, 200, 300)

</script>

情况3

<script>

function fn() {

var a = arguments[0]

var b = arguments[0]

var c = arguments[0]

var d = arguments[0]

for (var i = 1; i < arguments.length; i++) {

a += arguments[i]

b -= arguments[i]

c *= arguments[i]

d /= arguments[i]

}

console.log(a, b, c, d)

}

fn(12, 5, 7, 99, 103, 1)

08-练习

传入明文输出密文

传入一个4位数整数，每个数字加5，除以10的余数代替这个数字，第一个数和第四个数交互，第二个数和第三个数交互，输出密文(数字)

function fn(n) {

// n = 1234

// 把n拆成4个个位数

var a = (parseInt(n / 1000) + 5) % 10

var b = (parseInt(n / 100) % 10 + 5) % 10

var c = (parseInt(n / 10) % 10 + 5) % 10

var d = (n % 10 + 5) % 10

// 上班随意，上课不行

// console.log(d, c, b, a)

var tmp = a

a = d

d = tmp

var tmp2 = c

c = b

b = tmp2

console.log(Number('' + a + b + c + d))

}

fn(4567)

09-返回值

// return

// - 返回值

// - 只能在函数内使用

// - 终止函数运行，让函数调用变成一个值

// function fn() { }

// console.log(fn()) // undefined

// function fn() {

// // 把函数内的东西放到函数外使用

// return 100

// }

// console.log(fn()) // 100

练习

// function fn() {

// return 10 + '元'

// }

// console.log(fn())

// 封装：

function fn() {

var res = 0

for (var i = 0; i < arguments.length; i++) {

res += arguments[i]

}

return res

}

console.log(fn(12, 5, 7, 99, 103, 1) + '元')

console.log(fn(100, 200, 300) + '￥')

console.log(fn(1001, 200, 300))

10-封装

练习

html

<script src="utils.js"></script>

<script>

console.log(sum(12, 5, 7))

console.log(sum(12, 5, 7, 99))

console.log(sum(12, 5, 7, 1))

console.log(sum(12, 5))

console.log(max(12, 5, 888, 7, 99))

console.log(min(12, 5, 888, 7, 99))

function fn() {

return 1

alert(100)

}

fn()

</script>

utils.js

function sum() {

var res = 0

for (var i = 0; i < arguments.length; i++) {

res += arguments[i]

}

return res

}

function max() {

var m = arguments[0]

for (var i = 1; i < arguments.length; i++) {

if (m < arguments[i]) {

m = arguments[i]

}

return m

}

function min() {

var m = arguments[0]

for (var i = 1; i < arguments.length; i++) {

if (m > arguments[i]) {

m = arguments[i]

}

return m

}

11-预解析

含义，写法

// 让我们了解这个程序是怎么执行的

// 什么是预解析

// - 函数和变量

// - 把声明提升到最顶部 var a function fn() {}

// - 告诉计算机这个东西已经存在，防止报错（js是单线程语言）

// var a = 12

// console.log(a) // 12

预解析

var a

执行代码

console.log(a) // undefined

a = 12

// console.log(a) // undefined

// var a = 12

预解析

function fn() {

console.log(100)

}

执行代码

console.log(200) 200

fn()

console.log(100) 100

// function fn() {

// console.log(100)

// }

// console.log(200)

// fn()

预解析

var a

function fn() {

a = 200

}

执行代码

a = 100

console.log(a) // 100

fn()

a = 200

练习

var a = 100

function fn() {

a = 200

}

console.log(a) // 100

fn()

12-预解析错误写法

<script>

// 判断是否成立都不能阻止预解析

预解析

var a

// if (false) {

// var a = 12

// }

// console.log(a) // undefined

function fn() {

// return 终止函数运行，但是预解析会提前

console.log(a) // undefined

return

var a = 100

}

fn()

</script>

13-预解析面试题

<script>

预解析

var a

function test() {

alert(a)

a = "bb"

}

执行代码

a = "aa" "bb"

test()

alert(a) aa

a = "bb"

alert(a) bb

// var a = "aa"

// function test() {

// alert(a) // aa

// a = "bb"

// }

// test()

// alert(a) // bb

预解析

var fn

执行代码

console.log(fn) // undefined

fn() // 报错 fn is not a function

// console.log(fn)

// fn()

// var fn = function () {

// console.log(123)

// }

预解析

var fn

function fun() {

console.log('我是 fun 函数')

}

执行代码

fun()

console.log('我是 fun 函数')

fn = function () {

console.log('我是 fn 函数')

}

fn()

console.log('我是 fn 函数')

fn = 100

fn() // 报错 fn is not a function

// fun()

// var fn = function () {

// console.log('我是 fn 函数')

// }

// function fun() {

// console.log('我是 fun 函数')

// }

// fn()

// fn = 100

// fn()

// 报错

// var a = b

// a = 0

// b = 0

// console.log(a)

// console.log(b)

预解析

var fun

执行代码

fun = 200

fun()

var fun = 200

fun()

var fun = function () {

console.log('我是一个 fun 函数')

}

fun()

</script>

14-预解析经常性错误

<script>

// 预解析有范围

// 1. script

// 2. 函数

var a = 12

</script>

<script>

console.log(a) // 12

</script>

<script>

console.log(b) // 报错

</script>

<script>

var b

var b = 100

</script>

14-预解析经常性错误2

<script>

function fn() { // 函数会去计算机内申请一块空间

console.log('fn 函数')

}

var fn = 100 // 变量会去计算内申请一块内存

// fn()

console.log(fn) // 如果变量有值那输出的就是值，没有值输出的就是函数

</script>

柠檬养乐多.

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS_函数_预解析

01-练习 a.输出100-200之间的质数 // 100 - 200 // - 质数 for (var j = 100; j <= 200; j++) { // var n = j // 计数 var count = 0 for (var i = 2; i < j; i++) {...
复制链接

扫一扫