ES6之常用開發知識點：入門（一）

来源:https://www.cnblogs.com/moqiutao/archive/2020/02/05/12264897.html
-Advertisement-
Play Games

ES6介紹 ES6， 全稱 ECMAScript 6.0 ，2015.06 發版。 let 和 const命令 let命令 let 命令，用來聲明變數。它的用法類似於var，區別在於var聲明的變數全局有效，let 聲明的變數只在它所在的代碼塊內有效。 使用var聲明： var a = []; fo ...


ES6介紹

ES6， 全稱 ECMAScript 6.0 ，2015.06 發版。

let 和 const命令

let命令

let 命令，用來聲明變數。它的用法類似於var，區別在於var聲明的變數全局有效，let 聲明的變數只在它所在的代碼塊內有效。

使用var聲明：

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 10

使用閉包解決：

var a = [];
for (var i = 0; i < 10; i++) {
    (function(i){
        a[i] = function () {
          console.log(i);
        };
    })(i); 
}
a[6](); // 6

使用let：

var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 6
  • let 不存在變數提升，必須先聲明後使用，否則報錯；var存在變數提升，未聲明前使用輸出 undefined。
  • let 存在暫時性死區，在代碼塊內，使用let命令聲明變數之前，該變數都是不可用的。
  • let 不允許重覆聲明。

const 命令

const 聲明一個只讀的常量。一旦聲明，常量的值就不能改變。不能只聲明不賦值。

const a = 10;
a = 20; // 報錯

const b; // 報錯

const 的作用域與 let 相同。

if(true) {
  const num = 5;
}
console.log(num); // 報錯

const 聲明對象，常量對象記憶體地址，因此對象本身可改，但是給常量重新賦值就會報錯。

const obj = {};
obj.a = 'a';

obj = {}; // 報錯

塊級作用域和函數作用域

ES5 只有全局作用域和函數作用域，沒有塊級作用域，這帶來很多不合理的場景。

第一種場景，內層變數可能會覆蓋外層變數。

var tmp = new Date();

function f() {
  console.log(tmp);
  if (false) {
    var tmp = 'hello world';
  }
}

f(); // undefined

第二種場景，用來計數的迴圈變數泄露為全局變數。

var s = 'hello';

for (var i = 0; i < s.length; i++) {
  console.log(s[i]);
}

console.log(i); // 5

ES6的塊級作用域

let實際上為 JavaScript 新增了塊級作用域。

function f1() {
  let n = 5;
  if (true) {
    let n = 10;
  }
  console.log(n); // 5
}

塊級作用域的出現，實際上使得獲得廣泛應用的匿名立即執行函數表達式（匿名 IIFE）不再必要了。

// IIFE 寫法
(function () {
  var tmp = ...;
  ...
}());

// 塊級作用域寫法
{
  let tmp = ...;
  ...
}

ES5 規定，函數只能在頂層作用域和函數作用域之中聲明，不能在塊級作用域聲明。

// 情況一
if (true) {
  function f() {}
}

// 情況二
try {
  function f() {}
} catch(e) {
  // ...
}

上面兩種函數聲明，根據 ES5 的規定都是非法的。

ES6 引入了塊級作用域，明確允許在塊級作用域之中聲明函數。ES6 規定，塊級作用域之中，函數聲明語句的行為類似於let，在塊級作用域之外不可引用。

function f() { console.log('I am outside!'); }

(function () {
  if (false) {
    // 重覆聲明一次函數f
    function f() { console.log('I am inside!'); }
  }

  f();
}());

上面代碼在 ES5 中運行，會得到“I am inside!”，因為在if內聲明的函數f會被提升到函數頭部，實際運行的代碼如下。

// ES5 環境
function f() { console.log('I am outside!'); }

(function () {
  function f() { console.log('I am inside!'); }
  if (false) {
  }
  f();
}());

ES6 就完全不一樣了，理論上會得到“I am outside!”。因為塊級作用域內聲明的函數類似於let，對作用域之外沒有影響。但是，如果你真的在 ES6 瀏覽器中運行一下上面的代碼，是會報錯的，這是為什麼呢？

// 瀏覽器的 ES6 環境
function f() { console.log('I am outside!'); }

(function () {
  if (false) {
    // 重覆聲明一次函數f
    function f() { console.log('I am inside!'); }
  }

  f();
}());
// Uncaught TypeError: f is not a function

上面的代碼在 ES6 瀏覽器中，都會報錯。

原來，如果改變了塊級作用域內聲明的函數的處理規則，顯然會對老代碼產生很大影響。為了減輕因此產生的不相容問題，瀏覽器的實現可以不遵守上面的規定，有自己的行為方式。

  • 允許在塊級作用域內聲明函數。
  • 函數聲明類似於var，即會提升到全局作用域或函數作用域的頭部。
  • 同時，函數聲明還會提升到所在的塊級作用域的頭部。

註意，上面三條規則只對 ES6 的瀏覽器實現有效，其他環境的實現不用遵守，還是將塊級作用域的函數聲明當作let處理。

根據這三條規則，瀏覽器的 ES6 環境中，塊級作用域內聲明的函數，行為類似於var聲明的變數。上面的例子實際運行的代碼如下。

// 瀏覽器的 ES6 環境
function f() { console.log('I am outside!'); }
(function () {
  var f = undefined;
  if (false) {
    function f() { console.log('I am inside!'); }
  }

  f();
}());
// Uncaught TypeError: f is not a function

考慮到環境導致的行為差異太大，應該避免在塊級作用域內聲明函數。如果確實需要，也應該寫成函數表達式，而不是函數聲明語句。

另外，還有一個需要註意的地方。ES6的塊級作用域必須有大括弧，如果沒有大括弧，JavaScript 引擎就認為不存在塊級作用域。

// 第一種寫法，報錯
if (true) let x = 1;

// 第二種寫法，不報錯
if (true) {
  let x = 1;
}

上面代碼中，第一種寫法沒有大括弧，所以不存在塊級作用域，而let只能出現在當前作用域的頂層，所以報錯。第二種寫法有大括弧，所以塊級作用域成立。

函數聲明也是如此，嚴格模式下，函數只能聲明在當前作用域的頂層。

// 不報錯
if (true) {
  function f() {}
}

// 報錯
'use strict';
if (true)
  function f() {}

變數的解構賦值

ES6 允許按照一定模式，從數組和對象中提取值，對變數進行賦值，這被稱為解構（Destructuring）。

數組的解構賦值

模式匹配賦值，如果解構不成功，變數的值就等於 undefined。

let [a, [[b], c]] = [1, [[2], 3]];
console.log(a,b,c); // 1, 2, 3

let [x, , y, z] = [1, 2, 3];
console.log(x); // 1
console.log(y); // 3
console.log(z); // undefined

不完全解構賦值，等號左邊的模式，只匹配一部分的等號右邊的數組。

let [x, [y], z] = [1, [2, 3], 4];
console.log(x); // 1
console.log(y); // 2
console.log(z); // 4

數組結構賦值右邊必須是數組，模式不匹配則報錯。

let [a] = {}; // 報錯

解構賦值可以添加預設值，並且可以引用解構賦值的其他變數。

let [a = 1, b = 2] = [, 3];
console.log(a); // 1
console.log(b); // 3

let [x = 1, y = x] = [];  // x = 1; y = 1
let [x = 1, y = x] = [2]; // x = 2; y = 2

數組解構賦值可用於交換變數的值。

let [a, b] = [1, 2];
console.log(a, b); // 1, 2
[b, a] = [a, b];
console.log(a, b); // 2, 1

對象的解構賦值

變數必須與屬性同名

let { a, b, c } = { a: 'aaa', b: 'bbb' };
console.log(a); // 'aaa'
console.log(b); // 'bbb'
console.log(c); // undefined

變數名與屬性名不一致

let { a: x, b: y } = { a: 'aaa', b: 'bbb' };
console.log(x); // 'aaa'
console.log(y); // 'bbb'

嵌套賦值，如果子對象所在的父屬性不存在，會報錯，慎用。

let { a, a: {x}, b: y } = { a: {x: 'xxx',y: 'yyy'}, b: "bbb" };
console.log(a); // { x: 'xxx', y: 'yyy' }
console.log(x); // 'xxx'

let {c: {d: {e}}} = {c: 'ccc'}; // 報錯
console.log(e)

字元串解構賦值

字元串解構賦值，將字元串轉化成數組對象

const [a,b,c] = '123456789';
const {length} = '123456789';
console.log(a, b, c, length); // 1, 2, 3, 9

類似數組的對象都有一個length屬性，因此還可以對這個屬性解構賦值。

let {length : len} = 'hello';
len // 5

函數參數解構賦值

function add([x, y]){
  return x + y;
}

add([1, 2]); // 3

下麵是另一個例子:

const arr = [[1, 2], [3, 4]].map(([a, b]) => a + b);
console.log(arr); // [ 3, 7 ]

函數參數的解構也可以使用預設值。

function move({x = 0, y = 0} = {}) {
  return [x, y];
}

move({x: 3, y: 8}); // [3, 8]
move({x: 3}); // [3, 0]
move({}); // [0, 0]
move(); // [0, 0]

上面代碼中，函數move的參數是一個對象，通過對這個對象進行解構，得到變數x和y的值。如果解構失敗，x和y等於預設值。

註意，下麵的寫法會得到不一樣的結果。

function move({x, y} = { x: 0, y: 0 }) {
  return [x, y];
}

move({x: 3, y: 8}); // [3, 8]
move({x: 3}); // [3, undefined]
move({}); // [undefined, undefined]
move(); // [0, 0]

上面代碼是為函數move的參數指定預設值，而不是為變數x和y指定預設值，所以會得到與前一種寫法不同的結果。

字元串擴展

for...of 遍歷字元串

for(let codePoint of 'string'){
  console.log(codePoint)
}
// 's'
// 't'
// 'r'
// 'i'
// 'n'
// 'g'

includes()，startsWith()，endsWith()

let s = 'Hello world!';

const [a, b, c] = [
    s.startsWith('Hello', 2),
    s.endsWith('!'),
    s.includes('o w')
];

console.log(a, b, c); // false true true

repeat()

repeat 方法返回一個新字元串，表示將原字元串重覆 n 次。

  • 參數為[-Infinity,-1]或者 Infinity，會報錯；
  • 參數為(-1,1)時，相當於參數為 0；
  • 參數為小數時向下取整；
  • 參數 NaN 等同於 0；
  • 參數是字元串，則會先轉換成數字。
'str'.repeat('3') // 'strstrstr'

padStart(), padEnd()

padStart()，padEnd()有兩個參數，第一個參數為字元串補全生效的最大長度，第二個參數為補全的字元串。

第二個參數預設為空格，省略第二個參數時預設用空格補全。

第一個參數小於字元串原長度時，返回原字元串。

如果用來補全的字元串與原字元串，兩者的長度之和超過了最大長度，則會截去超出位數的補全字元串。

常見用途：補全指定位數，提示字元串格式。

'123456'.padStart(10, '0') // "0000123456"
'09-12'.padStart(10, 'YYYY-MM-DD') // "YYYY-09-12"

模版字元串（``)

const str = 'world';
const template = `Hello ${str}`;
console.log(template); // Hello world

數值擴展

二進位、八進位表示法

使用二進位表示法，首碼為 0b，使用八進位表示法，首碼為 0o，ES6 不支持使用 00 首碼表示八進位。

進位轉換使用 toString 方法，使用 Number 方法直接轉十進位。

0b1100100 === 100; // true
0o144 === 100; // true

(0b1100100).toString(8); // 144
(0b1100100).toString(10); // 100
Number('0b1100100'); // 100

Number.isFinite()，Number.isNaN()

Number.isFinite()用來檢查一個數值是否為有限的（finite），即不是 Infinity。參數類型不是數值，Number.isFinite 一律返回 false。

Number.isNaN()用來檢查一個值是否為 NaN。參數類型不是 NaN，Number.isNaN 一律返回 false。

Number.isFinite(15); // true
Number.isFinite(-Infinity); // false

Number.isNaN(15) // false
Number.isNaN(9/0) // true

Number.parseInt(), Number.parseFloat()

ES6 將全局方法 parseInt()和parseFloat()，移植到Number對象上面，行為完全保持不變。

Number.isInteger()

Number.isInteger()用來判斷一個數值是否為整數。

Number.isInteger(25) // true
Number.isInteger(25.0) // true
Number.isInteger(25.1) // false
  • Number.EPSILON 極小常量，浮點數誤差小於這個值可以認為不存在誤差；
  • Number.MAX_SAFE_INTEGER 安全整數的最大範圍；
  • Number.MIN_SAFE_INTEGER 安全整數的最小範圍；
  • Number.isSafeInteger() 用來判斷一個整數是否落在安全整數範圍之內。
Number.isSafeInteger(9007199254740993) // false
Number.isSafeInteger(990) // true
Number.isSafeInteger(9007199254740993 - 990) // true

Math 對象的擴展

Math.trunc() 除去一個數的小數部分，返回整數部分。參數不是數值，內部會先調用 Number()專為數值，對於空值和無法截取整數的值，返回 NaN。(Math 對象的擴展的方法對於非數值的處理方法都一樣)

Math.trunc(5.9) // 5
Math.trunc(-4.9) // -4
Math.trunc(null) // 0
Math.trunc('foo'); // NaN

Math.sign() 判斷一個數是正數、負數、還是零。

Math.sign(-5) // -1 負數
Math.sign(5) // +1 正數
Math.sign(0) // +0 零
Math.sign(-0) // -0 零
Math.sign(NaN) // NaN

Math.cbrt() 計算一個數的立方根。

Math.cbrt(2)  // 1.2599210498948734

// Math.sqrt(x) 計算平方根
Math.sqrt(2) // 1.4142135623730951

// 冪運算 Math.pow(x,y)
Math.pow(2, 3)

Math.hypot() 返回所有參數的平方和的平方根。

Math.hypot(3, 4);        // 5
Math.hypot(3, 4, 5);     // 7.0710678118654755

函數擴展

rest 參數

ES6 引入 rest 參數（形式為...變數名），用於獲取函數的多餘參數，rest 參數搭配的變數是一個數組，該變數將多餘的參數放入數組中。只能是最後一個參數，函數的 length 屬性，不包括 rest 參數。

function sum1(x, y, ...args) {
    let sum = 0;

    for (let arg of args) {
        sum += arg;
    }

    return sum;
}

console.log(sum1(1, 2, 3, 4)) // 7

function sum2(...args) {
    return args.reduce((prev, curr) => {
        return prev + curr
    }, 0)
}

console.log(sum2(1, 2, 3)); // 6

name 屬性

函數的 name 屬性，返回該函數的函數名。對於匿名函數，ES5 返回' '，ES6 返回變數名； Function 構造函數返回的函數實例，name 屬性的值為 anonymous；bind 返回的函數，name 屬性值會加上 bound 首碼。

function fn() {}
fn.name // 'fn'

function foo() {};
foo.bind({}).name // 'bound foo'

(new Function).name // "anonymous"

(function(){}).bind({}).name // 'bound '

箭頭函數

const fn = v => v;

// 等同於
const fn = function (v) {
  return v;
};

註意要點

  • 函數體內的 this 對象，就是定義時所在的對象，而不是使用時所在的對象；
  • 不可以當作構造函數，即不可以使用 new 命令，否則會拋出一個錯誤；
  • 不可以使用 arguments 對象，該對象在函數體內不存在。如果要用，可以用 rest 參數代替；
  • 不可以使用 yield 命令，因此箭頭函數不能用作 Generator 函數。

數組擴展

擴展運算符

擴展運算符（spread）是三個點（...）。它好比rest參數的逆運算，將一個數組轉為用逗號分隔的參數序列。

const arr = [1, 2, 3];
arr.push(...[4, 5, 6]);

擴展運算符的應用:

  • 數組展開
const arr = [1, 2, 3];
...arr // 1, 2, 3
  • 複製數組
const a1 = [1, 2];
// 寫法一
const a2 = [...a1];
// 寫法二
const [...a2] = a1;

// 相當於
const a1 = [1, 2];
const a2 = a1.concat();
  • 解構賦值，字元串轉數組
const list = [1, 2, 3];
[a, ...b] = list;
console.log(a) // 1
console.log(b) // [2, 3]

[...'hello'] // ['h', 'e', 'l', 'l', 'o']

Array.from()

Array.from 方法用於將兩類對象轉為真正的數組：類似數組的對象（array-like object）和可遍歷（iterable）的對象（包括 ES6 新增的數據結構 Set 和 Map）。

常見的類似數組的對象有 DOM 操作返回的 NodeList 集合，以及函數內部的 arguments 對象。

let arrayLike = {
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length: 3
};

// ES5的寫法
var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c']

// ES6的寫法
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']

Array.from('hello');
// ['h', 'e', 'l', 'l', 'o']

let namesSet = new Set(['a', 'b']);
Array.from(namesSet); // ['a', 'b']

Array.from 還可以接受第二個參數，作用類似於數組的map方法，用來對每個元素進行處理，將處理後的值放入返回的數組。

let arrayLike = {
    '0': 1,
    '1': 2,
    '2': 3,
    length: 3
};
Array.from(arrayLike, x => x * x); // [ 1, 4, 9 ]

Array.of()

Array.of 方法用於將一組值，轉換為數組。這個方法的主要目的，是彌補數組構造函數 Array()的不足。因為參數個數的不同，會導致 Array()的行為有差異。

Array.of() // []
Array.of(undefined) // [undefined]
Array.of(1) // [1]
Array.of(1, 2) // [1, 2]

copyWithin()

參數：

  • target（必需）：必需。複製到指定目標索引位置。
  • start（可選）：可選。元素複製的起始位置。
  • end（可選）：可選。停止複製的索引位置(預設為array.length)。如果為負值，表示倒數。

這三個參數都應該是數值，如果不是，會自動轉為數值。

var result = [1, 2, 3, 4, 5].copyWithin(0, 3) 
console.log(result)//[4,5,3,4,5]

find() 和 findIndex()

數組實例的 find 方法，用於找出第一個符合條件的數組成員，如果沒有符合條件的成員，則返回 undefined。

findIndex 方法返回第一個符合條件的數組成員的位置，如果所有成員都不符合條件，則返回-1。

[1, 4, -5, 10].find(n => n < 0); // -5
[1, 4, -5, 10].findIndex(n => n < 0); // 2

兩個方法都可以接受第二個參數，用來綁定回調函數的 this 對象。

function f(v){
  return v > this.age;
}
let person = {name: 'John', age: 20};
[10, 12, 26, 15].find(f, person);  // 26

這兩個方法都可以發現 NaN，彌補了數組的 indexOf 方法的不足。

fill() 填充數組

fill 方法使用給定值，填充一個數組。fill 方法可以接受第二個和第三個參數，用於指定填充的起始位置和結束位置。如果填充的類型為對象，那麼被賦值的是同一個記憶體地址的對象，而不是深拷貝對象，改變數組中的一項，則所有項都改變。

let arr = Array.of(1, 2, 3).fill({
    num: 20
});

console.log(arr); // [ { num: 20 }, { num: 20 }, { num: 20 } ]

arr[0].num = 10;
console.log(arr); // [ { num: 10 }, { num: 10 }, { num: 10 } ]

entries()，keys() 和 values() 遍曆數組

for (let index of ['a', 'b'].keys()) {
  console.log(index);
}
// 0
// 1

for (let elem of ['a', 'b'].values()) {
  console.log(elem);
}
// 'a'
// 'b'

for (let [index, elem] of ['a', 'b'].entries()) {
  console.log(index, elem);
}
// 0 "a"
// 1 "b"

includes()

includes 方法返回一個布爾值，表示某個數組是否包含給定的值，與字元串的 includes 方法類似。該方法的第二個參數表示搜索的起始位置，第二參數是負數，取它的倒數，第二參數大於數組長度，取 0。

[1, 2, 3].includes(3, -1); // true

flat()，flatMap()

flat()預設只會“拉平”一層，如果想要“拉平”多層的嵌套數組，可以將 flat()方法的參數寫成一個整數，表示想要拉平的層數，預設為 1。

flat()的參數為 2，表示要“拉平”兩層的嵌套數組。如果不管有多少層嵌套，都要轉成一維數組，可以用 Infinity 關鍵字作為參數。

[1, [2, [3]]].flat(Infinity);
// [1, 2, 3]

flatMap()先遍曆數組，再“拉平”一層，也只能拉平一層。參數與 map()方法類似。

[2, 3, 4].flatMap(x => [x, x * 2]); // [2, 4, 3, 6, 4, 8]

// 相當於
[2, 3, 4].map(x => [x, x * 2]).flat(); // [2, 4, 3, 6, 4, 8]

對象擴展

屬性簡潔表示法

const a = 1;
const b = 2;

const c = {a, b};
// 等同於
const c = {a: a, b: b};

const o = {
  method() {
    return "Hello!";
  }
};
// 等同於
const o = {
  method: function() {
    return "Hello!";
  }
};

function f(x, y) {
  return {x, y};
}
// 等同於
function f(x, y) {
  return {x: x, y: y};
}

對象的擴展運算符

對象擴展符類似數組擴展符，主要用於解構賦值。

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
x // 1
y // 2
z // { a: 3, b: 4 }

let ab = { ...a, ...b };
// 等同於
let ab = Object.assign({}, a, b);

Object.is()

它用來比較兩個值是否嚴格相等，與嚴格比較運算符（===）的行為基本一致。

Object.is('str', 'str'); // true
Object.is({}, {}); // false

不同之處只有兩個：一是+0不等於-0，二是NaN等於自身。

+0 === -0 //true
NaN === NaN // false

Object.is(+0, -0) // false
Object.is(NaN, NaN) // true

Object.assign()

Object.assign方法用於對象的合併，將源對象（source）的所有可枚舉屬性，複製到目標對象（target）。

Object.assign方法的第一個參數是目標對象，後面的參數都是源對象。如果目標對象與源對象有同名屬性，或多個源對象有同名屬性，則後面的屬性會覆蓋前面的屬性。

由於undefined和null無法轉成對象，所以如果它們作為首參數，就會報錯。

const target = { a: 1, b: 1 };

const source1 = { b: 2, c: 2 };
const source2 = { c: 3 };

Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}

常見用途：

  • 為對象添加屬性和方法
  • 克隆或合併對象
  • 給屬性指定預設值

Object.keys()，Object.values()，Object.entries()

ES5 引入了Object.keys方法，返回一個數組，成員是參數對象自身的（不含繼承的）所有可遍歷（enumerable）屬性的鍵名。

var obj = { foo: 'bar', baz: 42 };
Object.keys(obj)
// ["foo", "baz"]

Object.values方法返回一個數組，成員是參數對象自身的（不含繼承的）所有可遍歷（enumerable）屬性的鍵值。

const obj = { foo: 'bar', baz: 42 };
Object.values(obj)
// ["bar", 42]
const obj = { 100: 'a', 2: 'b', 7: 'c' };
Object.values(obj)
// ["b", "c", "a"]

上面代碼中，屬性名為數值的屬性，是按照數值大小，從小到大遍歷的，因此返回的順序是b、c、a。

Object.values只返回對象自身的可遍歷屬性。

const obj = Object.create({}, {p: {value: 42}});
Object.values(obj) // []

上面代碼中，Object.create方法的第二個參數添加的對象屬性（屬性p），如果不顯式聲明，預設是不可遍歷的，因為p的屬性描述對象的enumerable預設是false，Object.values不會返回這個屬性。只要把enumerable改成true，Object.values就會返回屬性p的值。

const obj = Object.create({}, {p:
  {
    value: 42,
    enumerable: true
  }
});
Object.values(obj) // [42]

Object.entries()方法返回一個數組，成員是參數對象自身的（不含繼承的）所有可遍歷（enumerable）屬性的鍵值對數組。

const obj = { foo: 'bar', baz: 42 };
Object.entries(obj)
// [ ["foo", "bar"], ["baz", 42] ]

除了返回值不一樣，該方法的行為與Object.values基本一致。

Object.fromEntries()

Object.fromEntries()方法是Object.entries()的逆操作，用於將一個鍵值對數組轉為對象。

Object.fromEntries([
  ['foo', 'bar'],
  ['baz', 42]
])
// { foo: "bar", baz: 42 }

 


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

-Advertisement-
Play Games
更多相關文章
  • 資料庫操作函數筆記
    2020-02-05 mysqli擴展 phpl連接Mysql mysqli_connect($servername,$username,$password,$database,$port); //參數1:連接的主機 參數2:資料庫登錄賬號 參數3:資料庫登錄密碼 參數4:將要連接的資料庫 參數5: ...
  • redis 5.0.7 源碼閱讀——整數集合intset
    redis中整數集合intset相關的文件為：intset.h與intset.c intset的所有操作與操作一個排序整形數組 int a[N]類似，只是根據類型做了記憶體上的優化。 一、數據結構 1 typedef struct intset { 2 uint32_t encoding; 3 uin ...
  • android sdk manager 無法更新，解決連不上dl.google.com的問題
    android sdk manager 無法更新，解決連不上dl.google.com的問題 ...
  • Binder基本使用
    Android開發中，Binder是一種跨進程通信方式，而使用AIDL可以實現Binder的工作。 如何使用它是瞭解它的第一步，本文章主要記錄使用Binder的一些步驟。（代碼思路參考《Android開發藝術探索》任玉剛 著） 1.創建兩個activity 兩個activity（OneActivit ...
  • Kotlin DSL for HTML實例解析
    Kotlin DSL, 指用Kotlin寫的Domain Specific Language. 本文通過解析官方的Kotlin DSL寫html的例子, 來說明Kotlin DSL是什麼. 首先是一些基礎知識, 包括什麼是DSL, 實現DSL利用了那些Kotlin的語法, 常用的情形和流行的庫. ... ...
  • 瀏覽器對象模型“BOM”-- window對象
    global對象 全局對象 所有的全局變數和全局方法，都可以歸在window上 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> body{ width:100 ...
  • checkbox 樣式重寫
    css樣式 .me-checkbox:checked { background: #1673ff } .me-checkbox { outline: none;/*輪廓*/ width: 25px; height: 25px; background-color: #ffffff; border: s ...
  • js Dom為頁面中的元素綁定鍵盤或滑鼠事件
    html滑鼠事件 onload 頁面載入 onclick 滑鼠單擊 onmouseover 滑鼠移入 onmouseout 滑鼠移出 onfocus 獲取焦點 onblur 失去焦點 onchange 域的內容改變 在事件觸發中，this表示對當前dom對象的引用 1、html事件，在html元素上 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類