day3-函數

来源:https://www.cnblogs.com/sml-ylz/archive/2023/11/28/17862265.html
-Advertisement-
Play Games

迴圈練習 1、列印100以內7的倍數 // 需要驗證的是1-100之間的數字 迴圈計數器正好可以表示 // i初始值設置為1 正好可以表示出需要驗證的數字 for (var i = 1; i <= 100; i++) { if (i % 7 == 0) { console.log(i) } } 2、 ...


迴圈練習

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、賦值式函數 不論什麼情況 永遠只能在函數之後調用


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • HarmonyOS 開發入門（二）
    HarmonyOS 開發入門（二） 日常逼逼叨 在HarmonyOS 開發入門（一）中我們描述了 HarmonyOS 開發的語言ArKTs以及Ts簡單的入門級語法操作，接下來我們進入第二部分HarmonyOS開發編輯器以及helloWorld項目創建，有任何說的不合理的地方，希望各位看官老爺批評指正 ...
  • HarmonyOS 開發入門（一）
    HarmonyOS 開發入門（一） 日常逼逼叨 因為本人之前做過一些Android相關的程式開發，對移動端的開發興趣比較濃厚，近期也瞭解到了一些關於華為HarmonyOS 4.0 的事件熱點，結合黑馬相關教學視頻以及一些相關的技術博客，對HarmonyOS開發做一個知識總結，有任何說的不合理的地方， ...
  • Android app相容低版本Java環境
    原文地址: Android app相容低版本Java環境 - Stars-One的雜貨小窩 起因是修複一個Bug遇到的問題,找到了一個可以讓app相容低版本java的方法 眾所周知,Android版本更新後,其內置的JRE環境也隨之更新了 假如我們在app中用到了JDK8的特有的屬性,而用戶的手機設 ...
  • 前端出現變數map未定義
    原來錯誤代碼 mounted() { .... this.map.addEventListener("click", function(e){//地圖單擊事件 var geocoder = new BMap.Geocoder(); var point = new BMap.Point(e.latln ...
  • 自學day7 數組
    typora-copy-images-to: media 數組 一、概念 對象中可以通過鍵值對存儲多個數據，且數據的類型是沒有限制的，所以通常會存儲一個商品的信息或一個人的信息： var obj = { goodsname:"手機", price:"5000", introduce:"手機很時尚，很 ...
  • React 中事件處理
    不要問自己需要什麼樣的人生，而要問自己想要成為什麼樣的人。 我們從前面的學習知道一個 React 組件不僅僅只包含 DOM 結構的，還應該樣式和 Javascript 邏輯的。這裡我們認識邏輯構造之事件處理。 1. React 事件處理 這裡列舉了在 React 中事件的幾種綁定處理方式： impo ...
  • 記錄--仿貝殼地圖畫圈找房功能實現（高德地圖）
    這裡給大家分享我在網上總結出來的一些知識，希望對大家有所幫助 仿貝殼地圖畫圈找房功能實現（高德地圖） 前言 在最近租房時，看到貝殼找房上線了一個地圖畫圈找房的功能，感覺很是新奇。接觸地圖開發也有很長一段時間了，以前大部分都是基於web pc端開發，所以一般遇到這種圈選，繪製多邊形圓形都是直接基於官方 ...
  • Vite4+Typescript+Vue3+Pinia 從零搭建(4) - 代碼規範
    項目代碼同步至碼雲 weiz-vue3-template 要求代碼規範，主要是為了提高多人協同和代碼維護效率，結合到此項目，具體工作就是為項目配置 eslint 和 prettier。 editorconfig 安裝 EditorConfig for VS Code 插件，根目錄下新建 .edito ...
一周排行
    -Advertisement-
    Play Games
  • WPF 已知問題 監聽 WMI 事件導致觸摸失效
    示例項目結構 在 Visual Studio 中創建一個 WinForms 應用程式後，項目結構如下所示： MyWinFormsApp/ │ ├───Properties/ │ └───Settings.settings │ ├───bin/ │ ├───Debug/ │ └───Release/ ...
  • [STAThread]特性
    [STAThread] 特性用於需要與 COM 組件交互的應用程式，尤其是依賴單線程模型（如 Windows Forms 應用程式）的組件。在 STA 模式下，線程擁有自己的消息迴圈，這對於處理用戶界面和某些 COM 組件是必要的。 [STAThread] static void Main(stri ...
  • UWP WinUI3 傳入 AddHandler 的 RoutedEventHandler 類型與事件所需不匹配將拋出參數異常
    在WinForm中使用全局異常捕獲處理 在WinForm應用程式中，全局異常捕獲是確保程式穩定性的關鍵。通過在Program類的Main方法中設置全局異常處理，可以有效地捕獲並處理未預見的異常，從而避免程式崩潰。 註冊全局異常事件 [STAThread] static void Main() { / ...
  • .NET 多版本 WinForm 開源控制項庫 SunnyUI
    前言 給大家推薦一款開源的 Winform 控制項庫，可以幫助我們開發更加美觀、漂亮的 WinForm 界面。 項目介紹 SunnyUI.NET 是一個基於 .NET Framework 4.0+、.NET 6、.NET 7 和 .NET 8 的 WinForm 開源控制項庫，同時也提供了工具類庫、擴展 ...
  • .net core8 使用Swagger（附當前源碼）
    說明 該文章是屬於OverallAuth2.0系列文章，每周更新一篇該系列文章（從0到1完成系統開發）。 該系統文章，我會儘量說的非常詳細，做到不管新手、老手都能看懂。 說明：OverallAuth2.0 是一個簡單、易懂、功能強大的許可權+可視化流程管理系統。 有興趣的朋友，請關註我吧(*^▽^*) ...
  • WPF 什麼時候 VisualTreeHelper.GetDescendantBounds 將返回無窮大
    一、下載安裝 1.下載git 必須先下載並安裝git，再TortoiseGit下載安裝 git安裝參考教程：https://blog.csdn.net/mukes/article/details/115693833 2.TortoiseGit下載與安裝 TortoiseGit，Git客戶端，32/6 ...
  • C# 開源教程帶你輕鬆掌握數據結構與演算法
    前言 在項目開發過程中，理解數據結構和演算法如同掌握蓋房子的秘訣。演算法不僅能幫助我們編寫高效、優質的代碼，還能解決項目中遇到的各種難題。 給大家推薦一個支持C#的開源免費、新手友好的數據結構與演算法入門教程：Hello演算法。 項目介紹 《Hello Algo》是一本開源免費、新手友好的數據結構與演算法入門 ...
  • 第22篇 生成proto文件bat腳本
    1.生成單個Proto.bat內容 @rem Copyright 2016, Google Inc. @rem All rights reserved. @rem @rem Redistribution and use in source and binary forms, with or with ...
  • 記一次 .NET某上位機視覺程式 卡死分析
    一：背景 1. 講故事 前段時間有位朋友找到我，說他的窗體程式在客戶這邊出現了卡死，讓我幫忙看下怎麼回事？dump也生成了，既然有dump了那就上 windbg 分析吧。 二：WinDbg 分析 1. 為什麼會卡死 窗體程式的卡死，入口門檻很低，後續往下分析就不一定了，不管怎麼說先用 !clrsta ...
  • 醫學DICOM文件與PACS系統進行數據傳輸
    前言 人工智慧時代，人臉識別技術已成為安全驗證、身份識別和用戶交互的關鍵工具。 給大家推薦一款.NET 開源提供了強大的人臉識別 API，工具不僅易於集成，還具備高效處理能力。 本文將介紹一款如何利用這些API，為我們的項目添加智能識別的亮點。 項目介紹 GitHub 上擁有 1.2k 星標的 C# ...
所有分類