主頁 > 企業開發 > 【技識訓累】JavaScript中的函式【一】

【技識訓累】JavaScript中的函式【一】

2023-06-14 09:53:57 企業開發

什么是函式？如何宣告函式？

JavaScript中的函式是一段可重復使用的代碼塊，它可以接受輸入并回傳輸出， 在JavaScript中，函式是一種特殊的物件，因此可以將其存盤在變數中，將其作為引數傳遞給其他函式，并從其他函式中回傳，

在JavaScript中，宣告函式有兩種方式：函式宣告和函式運算式，

1. 函式宣告

函式宣告是指用關鍵字function定義函式的方法，在函式名后跟一對圓括號和一對花括號，并在花括號中撰寫函式體，

示例：宣告一個函式，它將兩個數字相加并回傳其總和，

function addNumbers(num1, num2) {
  return num1 + num2;
}

2. 函式運算式

函式運算式是指將函式賦值給變數的方法，它通常包含一個匿名函式，因此可以使用變數名呼叫該函式，

示例：用函式運算式宣告一個函式，它列印出兩個數字的總和，

let addNumbers = function(num1, num2) {
  console.log(num1 + num2);
};

函式還可以在呼叫時接受引數，這些引數通常是函式需要的輸入，可以在函式中使用，

例如，下面的函式將兩個引數相加并回傳結果：

function addNumbers(num1, num2) {
  return num1 + num2;
}

let result = addNumbers(3, 5);
console.log(result); // 輸出結果為 8

在這個例子中，我們呼叫了addNumbers函式，并將3和5傳遞給它作為引數，計算完成后，該函式回傳結果8， 最后，我們將結果輸出到控制臺，

總之，JavaScript中的函式是一種強大的工具，可以幫助我們將代碼重用和管理代碼流程，無論是函式宣告還是函式運算式，我們都可以使用它們來創建代碼塊，以便在程式中多次使用，

函式如何回傳值

JavaScript函式可以回傳值，一個函式可以回傳一個值，這個值可以是任意型別的資料，包括數字、字串、物件等等，

要回傳一個值，可以使用關鍵字“return”后面跟著要回傳的值，示例如下：

function add(a, b) {
  return a + b;
}

var sum = add(2, 3);
console.log(sum); // 輸出 5

在這個例子中，函式“add”回傳了引數“a”和“b”的和，當使用這個函式時，回傳值會被存盤在變數“sum”中，并且在控制臺中輸出，

在函式內部，如果沒有明確的使用“return”陳述句，則默認回傳“undefined”，例如：

function sayHello() {
  console.log("Hello");
}

var result = sayHello();
console.log(result); // 輸出 undefined

在這個例子中，函式“sayHello”沒有回傳任何值，因此默認回傳了“undefined”，

在實際編程中，函式的回傳值通常用于向呼叫者傳遞處理結果或者狀態，例如，在某些情況下，可能需要根據函式回傳的值采取不同的操作，像這樣：

function checkAge(age) {
  if (age >= 18) {
    return "成年人";
  } else {
    return "未成年人";
  }
}

var result = checkAge(20);

if (result === "成年人") {
  console.log("你可以去看電影");
} else {
  console.log("你還不能去看電影");
}

在這個例子中，函式“checkAge”接收一個引數“age”，根據年齡判斷是否成年，并回傳“成年人”或“未成年人”，當呼叫函式時，回傳值被存盤在“result”變數中，在后面的代碼中，使用“if”陳述句根據回傳值來判斷是否可以去看電影，

什么是函式引數？函式引數傳遞的方式有哪些？

函式引數是函式定義時用來接收外部傳遞進來的值或物件的占位符，在呼叫函式時，我們需要傳遞實際的值或物件作為函式引數，以便在函式內部使用，

函式引數傳遞的方式有以下幾種：

  1. 傳遞單個值：直接把值傳遞給函式，

  2. 傳遞多個值：使用逗號分隔多個值，按照引數串列的順序傳遞給函式，

  3. 傳遞物件：將一個物件作為引數傳遞給函式，函式可以通過物件訪問其屬性，

  4. 傳遞陣列：將一個陣列作為引數傳遞給函式，函式可以使用陣列下標訪問陣列元素，

  5. 省略引數：可以省略某些引數，未傳遞的引數將被設定為undefined，

  6. 回呼函式：將一個函式作為另一個函式的引數傳遞，以便在另一個函式執行完成后呼叫該函式，

  7. 使用arguments物件：函式內部可以使用arguments物件訪問所有傳遞進來的引數，無需事先定義引數的名稱和數量，

  8. ES6中的展開運算子：可以使用展開運算子將陣列或物件中的值展開為函式的引數，

在函式中使用全域變數可以直接使用全域變數的名稱，在JavaScript中，全域變數可以通過在函式外部定義變數來創建，例如：

var globalVar = "Hello World!";

function myFunction() {
  console.log(globalVar);
}

myFunction(); // 輸出結果：Hello World!

在函式內部創建區域變數，可以使用var、let和const關鍵字定義一個新的變數，這些變數的作用域僅限于函式內部，函式外部無法訪問，例如：

function myFunction() {
  var localVar = "This is a local variable.";
  console.log(localVar);
}

myFunction(); // 輸出結果：This is a local variable.
console.log(localVar); // 拋出ReferenceError例外：localVar is not defined

在ES6中，使用let和const關鍵字創建的變數具有塊級作用域，可以在定義變數的塊中訪問該變數，包括在函式內部，例如：

function myFunction() {
  let localVar = "This is a local variable.";
  console.log(localVar);
}

myFunction(); // 輸出結果：This is a local variable.
console.log(localVar); // 拋出ReferenceError例外：localVar is not defined

什么是函式作用域

JavaScript的函式作用域是指變數可以在函式內宣告并在函式內使用，而在函式外無法訪問該變數，這是因為JavaScript中的函式都有它們自己的作用域，

例如，在以下示例中，變數x在函式foo的作用域中宣告，因此只能在該函式內部使用：

function foo() {
  var x = 10; // 變數x 只在函式foo中可見
  console.log(x);
}

console.log(x); // 報錯，變數x無法訪問

函式作用域可以幫助程式員避免變數命名沖突和全域變數的濫用，它還允許在函式內宣告和使用私有變數，這些變數不會泄露到全域作用域中，

JavaScript中的函式作用域實作是通過詞法作用域（也稱靜態作用域）實作的，在詞法作用域中，函式的作用域是在函式定義時確定的，而不是在函式呼叫時確定的，這意味著函式可以在它被定義的地方訪問其外部作用域中的變數，而不必等到函式被呼叫時，

什么是閉包？如何使用閉包？

閉包是指在一個函式內部定義另一個函式，并使得這個內部函式可以訪問到外部函式的變數和引數，閉包可以將這些變數和引數的值保存下來，以供后續使用，

在JavaScript中，可以使用閉包來實作許多功能，比如：

1. 封裝私有變數

通過使用閉包，可以創建一個物件，該物件包含一些私有變數和一些公共方法，但這些私有變數無法從外部訪問，這樣做可以保證代碼的安全性和可維護性，

例如：

function createCounter() {
  var count = 0;
  return {
    increment: function() {
      count++;
    },
    getValue: function() {
      return count;
    }
  };
}

var counter = createCounter();

counter.increment();
console.log(counter.getValue()); // 1

2. 延遲執行

通過使用閉包，可以在需要時延遲執行某些代碼，這對于一些需要耗費時間的操作（比如網路請求）很有用，

例如：

function delayedAlert(message, time) {
  setTimeout(function() {
    alert(message);
  }, time);
}

delayedAlert('Hello World!', 2000);

3. 記憶化

通過使用閉包，可以在函式執行時將其結果快取下來，以便下次執行時直接回傳快取的結果，從而提高性能，

例如：

function memoize(func) {
  var cache = {};
  return function() {
    var key = JSON.stringify(arguments);
    if (cache[key]) {
      return cache[key];
    } else {
      var result = func.apply(this, arguments);
      cache[key] = result;
      return result;
    }
  };
}

var fib = memoize(function(n) {
  if (n <= 1) {
    return n;
  } else {
    return fib(n - 1) + fib(n - 2);
  }
});

console.log(fib(10)); // 55

4. 模塊化

通過使用閉包，可以創建一個獨立的模塊，該模塊包含一些私有變數和方法，同時仍然可以對外暴露一些公共方法，

例如：

var calculator = (function() {
  var result = 0;

  function add(x) {
    result += x;
  }

  function subtract(x) {
    result -= x;
  }

  function reset() {
    result = 0;
  }

  function getResult() {
    return result;
  }

  return {
    add: add,
    subtract: subtract,
    reset: reset,
    getResult: getResult
  };
})();

calculator.add(5);
calculator.subtract(2);
console.log(calculator.getResult()); // 3
calculator.reset();
console.log(calculator.getResult()); // 0

總之，閉包是一種非常強大的功能，在JavaScript中廣泛使用，它可以用于封裝私有變數、延遲執行、記憶化、模塊化等多種場合，

閉包的優點和缺點是什么？

JavaScript閉包的優點：

  1. 可以通過閉包來創建私有變數和方法，防止變數和方法被外部代碼訪問和修改，從而保護程式的安全性，
  2. 可以幫助我們實作高階函式，從而提高代碼的可復用性，并且可以使代碼更加簡潔，
  3. 閉包可以實作資料快取，從而提高程式的性能，避免重復計算，

JavaScript閉包的缺點：

  1. 閉包可能導致記憶體泄漏，因為閉包中捕獲的變數不會被垃圾回識訓制自動釋放，
  2. 閉包的運行速度可能比常規函式慢，因為它需要同時保存外部函式的作用域和內部函式的作用域，
  3. 閉包可能會導致變數被意外修改，因為閉包中的變數是共享的，如果在外部函式中修改了閉包中的變數，那么所有使用該閉包的代碼都會受到影響，

什么是高階函式

在JavaScript中，高階函式是指能夠接收一個或多個函式作為引數，并且能夠回傳一個新函式的函式，這種函式的靈活性讓它們非常強大，并可以用于撰寫更加簡潔和靈活的代碼，

高階函式的特點：

  1. 接收一個或多個函式作為引數，
  2. 回傳一個新函式，
  3. 可以對引數函式進行處理，比如運算、組合、封裝等操作，

高階函式的使用場景：

  1. 回呼函式：在異步代碼中，高階函式常常被用作回呼函式，用于處理異步操作的結果，
  2. 遍歷：高階函式可以用于對陣列、物件或其他資料結構進行遍歷和篩選，
  3. 函陣列合：高階函式可以將多個處理邏輯組合在一起，實作更加復雜的功能，
  4. 封裝：高階函式可以用于對一些重復的操作進行封裝，提高代碼重用性和可維護性，

例如，如果我們想在一個陣列中找到所有大于3的數字，可以使用高階函式`filter`：

const arr = [1, 2, 3, 4, 5];
const result = arr.filter(function(item) {
  return item > 3;
});
console.log(result); // [4, 5]

在上述代碼中，`filter`函式就是一個高階函式，它接收一個匿名函式作為引數，用于處理陣列元素，并回傳一個新的陣列，其中僅包含滿足條件的元素，

什么是回呼函式？如何使用回呼函式？

回呼函式是一個在某個事件發生時執行的函式，它是JavaScript中一種常見的異步編程方式，回呼函式通常作為引數傳遞給另一個函式，并在另一個函式執行完畢后被呼叫，

使用回呼函式時，需要注意以下幾點：

  1. 回呼函式必須是一個函式，可以是內置函式或自定義函式，
  2. 回呼函式必須作為引數傳遞給另一個函式，并在另一個函式執行完畢后被呼叫，
  3. 回呼函式的引數和回傳值必須符合另一個函式的要求，

示例：

function add(a, b, callback) {
  var result = a + b;
  callback(result);
}

add(1, 2, function(result) {
  console.log(result);
});

在上面的例子中，add函式有三個引數，其中callback函式是回呼函式，當add函式執行完畢后，會呼叫這個回呼函式并傳遞計算結果，

在呼叫add函式時，傳入了兩個數字和一個回呼函式，回呼函式在add函式執行完畢后被呼叫，并列印出計算結果，

什么是箭頭函式？

JavaScript中的箭頭函式是ES6(ECMAScript 2015)中添加的一種新函式型別，箭頭函式是一種更簡潔的函式宣告方式，同時也有不同于傳統函式的一些特性，

箭頭函式的語法形式為：（引數）=> {函式體}

其中，引數和函式體之間由箭頭符號（=>）連接，

箭頭函式與傳統函式的一些不同點如下：

  1. 箭頭函式沒有自己的this物件，它的this繼承自父作用域，這意味著在箭頭函式中使用this時，它實際上是指向父作用域中的this，而不是箭頭函式自己的this，

  2. 箭頭函式沒有arguments物件，但可以使用rest引數(...args)取代，

  3. 如果箭頭函式只有一個引數，可以省略小括號，

  4. 如果函式體只有一條陳述句，可以省略大括號和return陳述句，

箭頭函式的應用場景：

  1. 作為回呼函式，箭頭函式的簡潔語法和繼承父作用域的this物件使它非常適合作為回呼函式，

  2. 與陣列方法結合使用，在陣列方法中，箭頭函式比傳統函式更具可讀性和簡潔性，

  3. 與PromiseAPI結合使用，在PromiseAPI中，箭頭函式可以幫助我們更方便地處理異步代碼，

總之，箭頭函式是一種更簡潔、更易讀、更方便的函式型別，它的使用可以提高代碼的可讀性和開發效率，

// 傳統函式
function greeting(name) {
  console.log("Hello, " + name);
}

// 箭頭函式
const greetingArrow = name => {
  console.log("Hello, " + name);
}

greeting("Tom"); // 輸出 "Hello, Tom"
greetingArrow("Jerry"); // 輸出 "Hello, Jerry"
const shoppingCart = [
   { id: 1, name: "Shirt", price: 25 },
   { id: 2, name: "Pants", price: 50 },
   { id: 3, name: "Shoes", price: 100 }
];

const VAT_RATE = 0.2; // 稅率

const calculateTotalPrice = shoppingCart => {
  // 使用 reduce 方法計算購物車中所有商品的總價
  const totalPrice = shoppingCart.reduce((acc, product) => acc + product.price, 0);
  
  // 計算總價和稅費
  const total = totalPrice + (totalPrice * VAT_RATE);
  
  // 四舍五入并保留兩位小數
  return Math.round(total * 100) / 100;
}

const total = calculateTotalPrice(shoppingCart);
console.log("Total Price: $" + total); // 輸出 "Total Price: $210"

什么是Promise？如何使用Promise？

Promise是JavaScript中一種異步編程的解決方案，它表示一個尚未完成但預計將來會完成的操作，并提供一種處理該操作結果的方式，

在Promise中，我們可以定義需要執行的操作，以及當操作完成后需要執行的一系列回呼函式，Promise既可以表示操作失敗的情況，也可以表示操作成功的情況，

Promise具有以下特點：

1. Promise物件的狀態不受外界影響，一旦狀態改變，就不會再變，任何時候都可以得到這個結果，

2. Promise物件的狀態一旦改變，就不能再改變，如果不設定回呼函式，Promise內部的錯誤不會影響到外部，

3. Promise 物件提供了鏈式操作，可以使其代碼更加簡潔易讀，

const promise = new Promise((resolve, reject) => {
  // 異步操作
  setTimeout(function(){
    const num = Math.random();
    if(num < 0.5){
      resolve(num)
    } else {
      reject(num)
    }
  }, 1000)
})

promise.then((res)=>{
  console.log("操作成功，結果為：", res);
}).catch((err)=>{
  console.log("操作失敗，結果為：", err);
})

上述代碼中，我們通過Promise建構式創建了一個Promise物件，在異步操作完成后通過resolve方法表示操作成功并回傳一個結果，通過reject方法表示操作失敗并回傳一個錯誤資訊，在then和catch方法中，我們分別定義了操作成功和操作失敗后需要執行的回呼函式，

 

Promise有三種狀態：pending、fulfilled和rejected，當異步操作執行時，它最初處于pending狀態，如果異步操作成功，則狀態變為fulfilled，并回傳一個值，如果發生錯誤，則狀態變為rejected，并回傳一個錯誤物件，

下面是使用Promise的簡單示例：

function fetchData() {
  return new Promise((resolve, reject) => {
    fetch('https://jsonplaceholder.typicode.com/users')
      .then(response => response.json())
      .then(data =https://www.cnblogs.com/yyyyfly1/p/> resolve(data))
      .catch(error => reject(error))
  })
}

fetchData()
  .then(data => console.log(data))
  .catch(error => console.error(error))

上面的代碼中，fetchData函式回傳一個Promise，如果異步操作成功，它會呼叫resolve回呼函式，并傳遞資料物件，如果發生錯誤，它會呼叫reject回呼函式，并傳遞一個錯誤物件，

在這個示例中，我們使用了fetch API來獲取資料，通過呼叫response.json()，我們將回應物件轉換為JSON格式的資料，最后，我們處理資料物件或錯誤物件，您可以在.then()和.catch()方法中進行操作，

在處理異步操作時，Promise非常強大且易于使用，它可以簡化代碼并提高可讀性，不要猶豫，嘗試使用Promise來處理異步操作，

什么是async/await？ 如何使用async/await？

async/await 是一種用于簡化異步操作的語法特性，它基于 Promise 物件，利用 async 和 await 關鍵字簡化 Promise 的鏈式呼叫和錯誤處理，使異步代碼看起來像同步代碼，

async 表示一個函式是異步的，并回傳一個 Promise 物件，await 表示等待 Promise 物件的解決，并回傳 Promise 物件的解決值，使用 async/await 可以避免回呼地獄，提高代碼的可讀性和可維護性，

使用 async/await 的基本流程如下：

1.定義一個異步函式，使用 async 關鍵字標記，

2.在函式中使用 await 關鍵字等待 Promise 物件處理完成，回傳 Promise 物件的解決值，

3.處理 Promise 物件的錯誤，使用 try...catch 捕獲異步操作的錯誤，

例如：

 

async function getData() {
  try {
    let response = await fetch('https://jsonplaceholder.typicode.com/users');
    let data = https://www.cnblogs.com/yyyyfly1/p/await response.json();
    console.log(data);
  } catch (error) {
    console.log(error);
  }
}

getData();

在上面的例子中，我們定義一個異步函式`getData`，使用 await 關鍵字等待 fetch() 方法回傳的 Promise 物件處理完成，然后再使用 await 關鍵字等待 response 物件的 json() 方法回傳的 Promise 物件處理完成，最后將回傳的 JSON 資料輸出，同時使用 try...catch 捕獲異步操作的錯誤，便于進行錯誤處理，

使用 async/await 可以大大簡化 Promise 的鏈式呼叫和錯誤處理，提高代碼的可讀性和可維護性，但需要注意的是，await 只能在 async 函式內部使用，否則會報語法錯誤，

在黑夜里夢想著光，心中覆寫悲傷，在悲傷里忍受孤獨，空守一絲溫暖， 我的淚水是無底深海，對你的愛已無言，相信無盡的力量，那是真愛永在， 我的信仰是無底深海，澎湃著心中火焰，燃燒無盡的力量，那是忠誠永在，

轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/555114.html

標籤：JavaScript

上一篇：前端進化筆記-JavaScript（三）

下一篇：返回列表

標籤雲
其他(160943) Python(38226) JavaScript(25495) Java(18235) C(15237) 區塊鏈(8270) C＃(7972) AI(7469) 爪哇(7425) MySQL(7248) html(6777) 基礎類(6313) sql(6102) 熊猫(6058) PHP(5875) 数组(5741) R(5409) Linux(5347) 反应(5209) 腳本語言(PerlPython)(5129) 非技術區(4971) Android(4591) 数据框(4311) css(4259) 节点.js(4032) C語言(3288) json(3245) 列表(3129) 扑(3119) C++語言(3117) 安卓(2998) 打字稿(2995) VBA(2789) Java相關(2746) 疑難問題(2699) 细绳(2522) 單片機工控(2479) iOS(2435) ASP.NET(2404) MongoDB(2323) 麻木的(2285) 正则表达式(2254) 字典(2211) 循环(2198) 迅速(2185) 擅长(2169) 镖(2155) .NET技术(1984) 功能(1967) HtmlCss(1966) Web開發(1951) C++(1939) python-3.x(1918) 弹簧靴(1913) xml(1889) PostgreSQL(1881) .NETCore(1863) 谷歌表格(1846) Unity3D(1843) for循环(1842)

熱門瀏覽
  • IEEE1588PTP在數字化變電站時鐘同步方面的應用

    IEEE1588ptp在數字化變電站時鐘同步方面的應用 京準電子科技官微——ahjzsz 一、電力系統時間同步基本概況 隨著對IEC 61850標準研究的不斷深入，國內外學者提出基于IEC61850通信標準體系建設數字化變電站的發展思路。數字化變電站與常規變電站的顯著區別在于程序層傳統的電流/電壓互 ......

    uj5u.com 2020-09-10 03:51:52 more
  • HTTP request smuggling CL.TE

    CL.TE 簡介 前端通過Content-Length處理請求，通過反向代理或者負載均衡將請求轉發到后端，后端Transfer-Encoding優先級較高，以TE處理請求造成安全問題。 檢測 發送如下資料包 POST / HTTP/1.1 Host: ac391f7e1e9af821806e890 ......

    uj5u.com 2020-09-10 03:52:11 more
  • 網路滲透資料大全單——漏洞庫篇

    網路滲透資料大全單——漏洞庫篇漏洞庫 NVD ——美國國家漏洞庫 →http://nvd.nist.gov/。 CERT ——美國國家應急回應中心 →https://www.us-cert.gov/ OSVDB ——開源漏洞庫 →http://osvdb.org Bugtraq ——賽門鐵克 →ht ......

    uj5u.com 2020-09-10 03:52:15 more
  • 京準講述NTP時鐘服務器應用及原理

    京準講述NTP時鐘服務器應用及原理京準講述NTP時鐘服務器應用及原理 安徽京準電子科技官微——ahjzsz 北斗授時原理 授時是指接識訓通過某種方式獲得本地時間與北斗標準時間的鐘差，然后調整本地時鐘使時差控制在一定的精度范圍內。 衛星導航系統通常由三部分組成：導航授時衛星、地面檢測校正維護系統和用戶 ......

    uj5u.com 2020-09-10 03:52:25 more
  • 利用北斗衛星系統設計NTP網路時間服務器

    利用北斗衛星系統設計NTP網路時間服務器 利用北斗衛星系統設計NTP網路時間服務器 安徽京準電子科技官微——ahjzsz 概述 NTP網路時間服務器是一款支持NTP和SNTP網路時間同步協議，高精度、大容量、高品質的高科技時鐘產品。 NTP網路時間服務器設備采用冗余架構設計，高精度時鐘直接來源于北斗 ......

    uj5u.com 2020-09-10 03:52:35 more
  • 詳細解讀電力系統各種對時方式

    詳細解讀電力系統各種對時方式 詳細解讀電力系統各種對時方式 安徽京準電子科技官微——ahjzsz，更多資料請添加VX 衛星同步時鐘是我京準公司開發研制的應用衛星授時時技術的標準時間顯示和發送的裝置，該裝置以M國全球定位系統（GLOBAL POSITIONING SYSTEM,縮寫為GPS）或者我國北 ......

    uj5u.com 2020-09-10 03:52:45 more
  • 如何保證外包團隊接入企業內網安全

    不管企業規模的大小，只要企業想省錢，那么企業的某些服務就一定會采用外包的形式，然而看似美好又經濟的策略，其實也有不好的一面。下面我通過安全的角度來聊聊使用外包團的安全隱患問題。 先看看什么服務會使用外包的，最常見的就是話務/客服這種需要大量重復性、無技術性的服務，或者是一些銷售外包、特殊的職能外包等 ......

    uj5u.com 2020-09-10 03:52:57 more
  • PHP漏洞之【整型數字型SQL注入】

    0x01 什么是SQL注入 SQL是一種注入攻擊，通過前端帶入后端資料庫進行惡意的SQL陳述句查詢。 0x02 SQL整型注入原理 SQL注入一般發生在動態網站URL地址里，當然也會發生在其它地發，如登錄框等等也會存在注入，只要是和資料庫打交道的地方都有可能存在。 如這里http://192.168. ......

    uj5u.com 2020-09-10 03:55:40 more
  • [GXYCTF2019]禁止套娃

    git泄露獲取原始碼 使用GET傳參，引數為exp 經過三層過濾執行 第一層過濾偽協議，第二層過濾帶引數的函式，第三層過濾一些函式 preg_replace('/[a-z,_]+\((?R)?\)/', NULL, $_GET['exp'] (?R)參考當前正則運算式，相當于匹配函式里的引數 因此傳遞 ......

    uj5u.com 2020-09-10 03:56:07 more
  • 等保2.0實施流程

    流程 結論 ......

    uj5u.com 2020-09-10 03:56:16 more
最新发布
  • 【技識訓累】JavaScript中的函式【一】

    博客推行版本更新，成果積累制度，已經寫過的博客還會再次更新，不斷地琢磨，高質量高數量都是要追求的，工匠精神是學習必不可少的精神。因此，大家有何建議歡迎在評論區踴躍發言，你們的支持是我最大的動力，你們敢投，我就敢肝 ......

    uj5u.com 2023-06-14 09:53:57 more
  • 前端進化筆記-JavaScript（三）

    人類在白色的底色上描繪圖畫，地球在黑色的底色上創造生命。 #變數、作用域與記憶體 JavaScript的變數可以說是獨樹一幟。只需要一個（或兩個等）關鍵字（const，let）就可以創建變數，創建時不考慮變數的型別，這是其他語言少有的強大功能。當然強大的功能總是伴隨著問題。 ###值 > 原始值：Un ......

    uj5u.com 2023-06-14 09:53:52 more
  • CSS常用屬性

    ## 顏色 1. **RGB** （紅，綠，藍）三種顏色的集合，最低值是0（十六進制00）到最高值255（十六進制FF） 2. **HSL** H色相（0-360），S飽和度（百分比），L亮度（百分比） 3. （不）透明度 **rgba、hsla** （新版瀏覽器可不寫a，直接寫4個值） ## li ......

    uj5u.com 2023-06-14 09:53:32 more
  • 用純HTML，JS，CSS實作橫向滾動標簽頁

    ### 前言 前不久，在我的一個專案中，需要展示一個橫向滾動的標簽頁，它支持滑鼠橫向拖動和點擊切換。在實作的程序中，我發現這個小功能需要同時用到前端的三輛馬車，但是實作難度不高，而且最終效果還不錯，是個難得的初學者專案，于是萌生了寫這篇文章的想法，希望對初學者有所幫助。同時為了避免初學者學習框架，我 ......

    uj5u.com 2023-06-14 09:53:26 more
  • springboot+JXLS+Jexl實作報表模版生成報表

    ##### 前言 做這個專案的思路是由于公司基于自身發展，需要將之前的老專案平臺拆解出來，由于之前的專案是所有的功能全部集中在一起，學習成本以及后續的擴展性來說，非常的不友好，并且由于之前設計人員的流失導致了專案無法進一步優化，所以想將其進行拆解，將單個功能模塊進行拆分，形成微服務化，使每個功能的業 ......

    uj5u.com 2023-06-14 09:53:01 more
  • MOS管基礎知識：輕松理解MOS管作業原理

    MOS管基礎知識：輕松理解MOS管作業原理。MOS管是一種利用電場效應來控制其電流大小的半導體三端器件，很多特性和應用方向都與三極管類似。這種器件不僅體積小、質量輕、耗電省、壽命長、而且還具有輸入阻抗高、噪聲低、熱穩定性好、抗輻射能力強等優點，應用廣泛，特別是在大規模的集成電路中。 ......

    uj5u.com 2023-06-14 09:52:54 more
  • springboot+JXLS+Jexl實作報表模版生成報表

    ##### 前言 做這個專案的思路是由于公司基于自身發展，需要將之前的老專案平臺拆解出來，由于之前的專案是所有的功能全部集中在一起，學習成本以及后續的擴展性來說，非常的不友好，并且由于之前設計人員的流失導致了專案無法進一步優化，所以想將其進行拆解，將單個功能模塊進行拆分，形成微服務化，使每個功能的業 ......

    uj5u.com 2023-06-14 09:52:23 more
  • MOS管基礎知識：輕松理解MOS管作業原理

    MOS管基礎知識：輕松理解MOS管作業原理。MOS管是一種利用電場效應來控制其電流大小的半導體三端器件，很多特性和應用方向都與三極管類似。這種器件不僅體積小、質量輕、耗電省、壽命長、而且還具有輸入阻抗高、噪聲低、熱穩定性好、抗輻射能力強等優點，應用廣泛，特別是在大規模的集成電路中。 ......

    uj5u.com 2023-06-14 09:52:17 more
  • 手寫一個 React 圖片預覽組件

    前幾天打算給博客添加一個圖片預覽的效果，可在網上找了半天也沒找到合適的庫，于是自己干脆自己手寫了個。 ......

    uj5u.com 2023-06-13 08:27:33 more
  • 記錄--詳解 XSS（跨站腳本攻擊）

    這里給大家分享我在網上總結出來的一些知識，希望對大家有所幫助 前言：我們知道同源策略可以隔離各個站點之間的 DOM 互動、頁面資料和網路通信，雖然嚴格的同源策略會帶來更多的安全，但是也束縛了 Web。這就需要在安全和自由之間找到一個平衡點，所以我們默認頁面中可以參考任意第三方資源，然后又引入 CSP ......

    uj5u.com 2023-06-13 08:22:13 more

Copyright © 2010-2020 有解無憂