day3-函数1

发布时间 2023-11-28 14:49:46作者: 而别

循环练习

1、打印100以内7的倍数

// 需要验证的是1-100之间的数字 循环计数器正好可以表示
// i初始值设置为1 正好可以表示出需要验证的数字
for (var i = 1; i <= 100; i++) {
    if (i % 7 == 0) {
        console.log(i)
    }
}

2、计算1~100之间所有奇数的和

// 计算1~100之间所有奇数的和  先找出 每一个奇数 然后求和运算
        var sum = 0;
        for (var i = 1; i <= 100; i++) {
            if (i % 2 != 0) {
                sum+=i;
            }
        }

3、入职薪水10K,每年涨幅5%,第50年工资多少

// 入职薪水10K,每年涨幅5%,第50年工资多少
var money = 10000;
for (var i = 2; i <= 50; i++) {
    money = money * 1.05;
    console.log('第'+i+'年的薪资是:'+money)
}

4、计算1000~2000之间的闰年(每行四个,打印到页面)

// 创建一个计数器 用于记录是第几个闰年
var index = 0;
// 计算1000~2000之间的闰年(每行四个,打印到页面)
for (var year = 1000; year <= 2000; year++) {
    if ((year % 4 == 0 && year % 100 != 0) || (year % 400 == 0)) {
        document.write(year +' ')
        index++;//if条件满足 说明找到了一个闰年 计数器需要增加
        if(index % 4 == 0){
            // 每四个
            document.write('<br/>')
        }

    }
}

5、计算水仙花数

 for (var num = 100; num <= 999; num++) {
            // 提取出数字中每一位数字
            // 百位数字
            var b = parseInt(num / 100);
            // 提取十位数字
            var s = parseInt((num - b * 100) / 10);
            // 提取个位数字
            var g = (num - b * 100) % 10;
            // b**次方数
            if (num == b ** 3 + s ** 3 + g ** 3) {
                console.log(num + '是水仙花数')
            }
        }

6、计算素数

// 计算素数
var num = 9;
// 素数是除了自己跟1之外的任何一个数都无法除尽
// 需要将当前这个数从2开始 一路除以到4 过程中 有一个数可以被除尽证明不是素数 否则就是素数
// 假设现在的这个数是一个素数 使用true表示
// var flag = true;
// for (var i = 2; i < num; i++) {
//     // 在循环的过程中if判断会执行很多次
//     if (num % i == 0) {
//         flag = false;
//     }
// }
// // 循环结束 flag为false 说明 不是素数 如果 flag还是true 就说明前面没有一次是可以除尽
// console.log(flag ? '素数' : '不是素数')

// js中两个关键字 break continue;
// for(var i =0;i<10;i++){
//     if(i==4){
//         break;
//     }
//     console.log(i);
// }

// for (var i = 0; i < 10; i++) {
//     if (i == 4) {
//         continue;
//     }
//     console.log(i);
// }
// console.log('over')
// break整个循环退出 不管后面还有多少次循环没有执行 
// continue是跳出当前这一次循环,后面还有循环需要执行的继续
var flag = true;
for (var i = 2; i < num; i++) {
    // 在循环的过程中if判断会执行很多次
    if (num % i == 0) {
        flag = false;
        break;
    }
    console.log('循环执行了')
}

7、九九剩法表

// 输出9*9table标签

// 1、输出1个tr中存在9个td单元格
// var html = '<table><tr>';
// for (var i = 1; i <= 9; i++) {
//     html += '<td></td>';
// }
// html += '</tr></table>';
// document.write(html);

// 2、9个tr 每个tr中9个td
// 循环嵌套 外层循环执行一次 里层循环执行n次
// 当j = 1的时候 里层循环中i 会从1执行到9  j = 1  i = 1循环体代码 i=2循环体代码
// 当j = 1的时候 i需要 1
// 当j = 2的时候 i需要 1 2

var html = '<table border="1">';
for (var j = 1; j <= 9; j++) {
    html += '<tr>'
    for (var i = 1; i <= j; i++) {
        html += '<td>' + i + ' * ' + j + ' = ' + (i * j) + '</td>';
    }
    html += '</tr>';
}
html += '</table>';
document.write(html);

8、填数

var html = '<table>';
for (var i = 1; i <= 10; i++) {
    html += '<tr>'
    for (var j = 1; j <= 10; j++) {
        //(i-1)*10+j
        // i = 1 表示第一行  需要设置 1-10
        // j = 1  值为1
        // j = 2  值为2
        // 。。。
        // i = 2 表示第二行 需要设置 11-20
        // j = 1  值为11
        // j = 2  值为12
        // 。。。
        html += '<td>' + ((i - 1) * 10 + j) + '</td>'
    }
    html += '</tr>'
}

html += '<table>'
document.write(html)

初识数组

数组的作用

js中基本数据类型只能存储一个值 存在弊端
例如现在需要编写程序计算出所有同学的平均成绩,所以需要记录每一个同学额分数。可以每一个同学使用一个变量名称表示,但是不方便。如果人数发生改变 需要修改代码
所以需要使用数组结构。通过使用数组 可以存储多份数据

数组的基本使用

1、创建数组

// 1、创建数组 
// 语法  var 变量名称 = [元素1,元素2,....];  在创建数组中使用中括号叫做字面量  具体存储的每一个值叫做元素 元素没有数据类型的约束,可以是任何一种数据类型 但是一般所有元素都是相同的数据类型
// 如果数组中没有元素 叫做空数组 但是空数组转换为布尔值是真
// var score = [];
var score = [80, 67, 90, 53];
console.log(score)

2、控制台查看的结果

1700635743683

3、访问数组元素

// 2、访问数组中元素
        // 语法:变量名称[下标] 下标千万不要越界
        console.log(score[6]); // undefined
        // 在获取数据是 将下标保存到其他变量中通过 数组[下标变量]
        var index = 3;
        console.log(score[index]);

4、数组长度

// 3、数组长度
console.log(score.length);//这个是对象访问属性的语法
// score[length] 这个表示取出score数组中length变量保存的值的元素
// 获取数组长度
// console.log(score['length'])
// 规律 数组最大下标=数组长度-1
console.log(score[score.length-1]);//获取最后一个元素值

5、数组修改元素/追加元素

var arr = ['a','b']
// 修改语法  数组变量[下标]=值  如果存在下标就修改不存在下标就添加
arr[1] = 'c'
// 追加一个元素
arr[arr.length] = 'cc'
console.log(arr)

6、数组遍历

// 5、数组遍历(就是将数组中每一个元素取出使用  循环)
var sum = 0;
for (var i = 0; i < score.length; i++) {
    // 每次循环 i表示 0 1 2 ... 正好对应着数组的下标
    sum += score[i]
}
console.log(sum / score.length)

变量内存分布

内存地址解释

计算机中所有的功能都是CPU在进行计算,但是CPU没有存储数据的能力。所有运算都是由内存条中存储的数据提供。
为了更好的使用内存管理数据,操作系统将内存划分为多个区域。主要关心的是堆区与栈区。堆区与栈区空间依旧很大。所为了方便去管理,每个区域都继续进行一个更小的划分,每一个小区域都分配一个编号,编号就叫做内存地址。实际使用 可以使用十六进制的数
堆区:相对空间比较大 相对效率要低
栈区:相对空间小 相对效率要高

基本数据类型

1、示例代码

//先创建i变量(在栈区开辟一个空间)  赋值时将变量的值存储起来 
        var i = 10;
        // 先创建j变量 在栈区开辟一个空间 当执行j=i(赋值语句 永远会将变量在栈区存储的值进行赋值) 将i变量在栈区存储的值拷贝一份 存储到j变量的栈区
        var j = i;
        // i=20是一个赋值语句 将i变量在栈区存储的值从10修改为20
        i = 20;
        // 取出j变量栈区的值 10
        console.log(j);//10

2、内存分布图

1700640622546

引用数据类型

1、示例代码

// var arrr 先在栈区开辟一个空间,当执行arr=[1,2,3] 将数据保存到堆区 栈区中记录数据在堆区的位置
        var arr = [1,2,3];
        // var newArr 在栈区开辟一个空间 当执行newArr = arr 将arr栈区存储的值赋值给newArr 导致newArr与arr变量对应堆区的同一份数据
        var newArr = arr;
        // 根据arr在栈区记录的地址到堆区中找到第一个值修改为100
        // arr[0] = 100;

        // console.log(newArr)
        // 此时的修改是直接赋值 会创建新的堆区空间记录数据 最后将arr在栈区的值存储为新的空间地址 导致 arr与newArr相互不影响
        arr = [3,4,5];

        console.log(newArr)

2、内存图

1700641786007

结论:

​ 1、变量直接(变量=值)赋值永远是修改栈区存储的内容

​ 2、基本类型直接赋值之后 其中一个变量修改不影响另外一个变量

​ 3、引用类型直接赋值后。如果顺着内存修改数据(arr[0]=100)两个变量相互印象,如果是直接给其中一个变量赋值导致与;另外一个变量不共享数据 最终两个变量独立相互不影响

函数

函数的作用

目前写的代码是不能复用的 如果需要实现一模一样的功能需要将代码复制一份,导致代码质量不高 并且不方便后期的维护
所以可以使用函数解决这个问题。函数的特点就是一次封装 多次调用

函数的定义与调用

1、语法

1、创建语法
	声明式函数:function 函数名称([形参列表]){
        函数体代码
        //可选的return语句  
    }
	赋值式函数:var 函数名称 = function([形参列表]){
        函数体代码
        //可选的return语句  
    } 
2、调用语法 函数名称([实参列表])

2、使用示例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 创建函数 函数创建不会将内部的代码执行
        function fn(){
            console.log('100行代码执行')
        }
        // 声明式函数
        var fn2 = function(){
            console.log('声明式函数')
        }
        // 调用函数
        fn();
        fn();
        fn();
        fn2();
        fn2();
    </script>
</body>
</html>

声明式与赋值式的区别

1、同一个script标签的情况

<!-- 函数创建与调用都在一个script标签中 -->
    <script>
        // 1、在同一个script标签中 声明式函数 任何位置都可以调用
        // 2、在同一个script标签中 赋值式的函数只能在函数之后调用
        fn();
        function fn(){
            console.log('声明式函数');
        }
        fn();

        // fn3 is not defined 说明fn3不存在
        // fn3();
        // fn2 is not a function  说明fn2存在 但是只是不是一个函数而已
        fn2();
        var fn2 = function(){
            console.log('提莫')
        }

        fn2()


    </script>

2、不同的script标签

<!-- 2、不同的script标签中 -->
    <script>
        // fn3();
        // fn4();
    </script>

    <script>
        var fn3 = function(){
            console.log('盖伦');
        }

        function fn4(){
            console.log('亚索');
        }
    </script>

结论

​ 1、声明式函数 在同一个script标签 任何位置都可以使用 但是在不同的script标签中只能在script标签后才可以调用

2、赋值式函数 不论什么情况 永远只能在函数之后调用