前端筆記之ES678&Webpack&Babel（中）對象|字元串|數組的擴展&函數新特性&類

来源:https://www.cnblogs.com/rope/archive/2019/04/23/10729802.html
-Advertisement-
Play Games

一、對象的擴展 1.1對象屬性名錶達式 ES6可以在JSON中使用[]包裹一個key的名字。此時這個key將用表達式作為屬性名（被當做變數求值），這個key值必須是字元串。 1.2 Object.assign()方法 該方法用於對象的合併，將源對象的所有可枚舉的屬性，複製到目標對象。 Object. ...


一、對象的擴展

1.1對象屬性名錶達式

ES6可以在JSON中使用[]包裹一個key的名字。此時這個key將用表達式作為屬性名（被當做變數求值），這個key值必須是字元串。

var a = 'name'
var obj = {
    [a] : "小明",
    age:12,
    sex:"男"
}
console.log(obj.name)

 

1.2 Object.assign()方法

該方法用於對象的合併，將源對象的所有可枚舉的屬性，複製到目標對象。

Object.assign()方法的第一個參數是目標對象，後面的參數都是源對象。

let obj1 = {a:1};
let obj2 = {a:2, b:3};
let obj3 = {b:4, c:5};
Object.assign(obj1,obj2,obj3)

console.log(obj1)
console.log(obj2)
console.log(obj3)

 

註意：

l 它沒有返回值，會直接改變Object.assign()中的第一個參數對象

l 後面可以羅列無限個對象，如果目標對象與源對象有同名屬性，或多個源對象有同名屬性，則後面的屬性會覆蓋前面的屬性

如果該參數不是對象，則會先轉成對象，然後返回。

typeof Object.assign(2) // "object"

 

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

Object.assign(undefined) // 報錯
Object.assign(null) // 報錯

1.3 Object.keys()方法

它可以將一個對象所有的鍵名（key）轉為一個數組對象，並返回：

let o = {a: 1, b: 2, c: 3};
console.log(Object.keys(o)); //[ 'a', 'b', 'c' ]

1.4 Object.values()方法

它可以將一個對象所有的鍵值（value）轉為一個數組對象，並返回：

let o = {a: 10, b: 20, c: 33};
console.log(Object.values(o)); //[ 10, 20, 33 ]

1.5 Object.entries()方法

它可以將一個對象所有的鍵名（key）和鍵值（value）轉為一個數組對象，並返回：

let o = {a: 10, b: 20, c: 33};
console.log(Object.entries(o));

1.6 Object.is()

ES5 比較兩個值是否相等，只有兩個運算符：相等運算符（==）和嚴格相等運算符（===）。它們都有缺點，前者會自動轉換數據類型，後者的NaN不等於自身，以及+0等於-0。JavaScript 缺乏一種運算，在所有環境中，只要兩個值是一樣的，它們就應該相等。

 

ES6 提出“Same-value equality”（同值相等）演算法，用來解決這個問題。Object.is就是部署這個演算法的新方法。它用來比較兩個值是否嚴格相等，與嚴格比較運算符（===）的行為基本一致。

console.log(Object.is('a','a')); //true
console.log(Object.is({}, {}));  //false
console.log(Object.is([], []));  //false

不同之處只有兩個：一是：+0不等於-0，二是NaN等於自身。
console.log(+0 === -0); //true
console.log(NaN === NaN); //false

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

 

二、字元串的擴展

2.1定義字元串``反引號

之前定義字元串，必須使用以下定界符

""或''

 

它們的缺點是在做連字元串的時候，不方便：

var name = "小明";
var age = 12;
var str = "你好，我是" + name + "我今年" + age + "歲";
console.log(str)

 

ES6中用``來做定界符：

var str = `你好`;
console.log(str)
console.log`str`
console.log(typeof str)

var name = "小明";
var age = 12;
var str = `你好，我是${name}我今年${age}歲`;
console.log(str)

註意：只有``中能夠用${}嵌套變數

 

動態求值：

var str = `今年是${2016 + 2}`;
console.log(str); //2018

能寫簡單運算、函數調用、變數、Math函數、數組表達式方法（map、reduce、filter、join）、三元運算符

 

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

var str1 = `哈${Math.random()}哈`;
var str2 = `哈${sum(3,4)}哈`;
var str3 = `哈${5 > 10 ? true : false}哈`;
console.log(str1)
console.log(str2)
console.log(str3)

2.2字元串方法

以前JavaScript只有indexOf方法，可以用來確定一個字元串是否包含在另一個字元串中。

 

ES6又提供了三種新方法：

includes()   返回Boolean值，檢查字元串或數組中是否存在某項

startsWith() 返回Boolean值，檢查參數字元串是否在原字元串的開頭

endsWith() 返回Boolean值，檢查參數字元串是否在原字元串的結尾

 

var url = "http://www.aiqianduan.com/";
console.log(url.includes("www"));    //true
console.log(url.startsWith("http")); //true
console.log(url.endsWith("com/"));   //true

 

這三個方法都支持第二個參數，表示開始搜索的位置：

let s = 'Hello world!';
console.log(s.includes('Hello', 6))   //false
console.log(s.startsWith('world', 6)) //true
console.log(s.endsWith('Hello', 5))   //true

上面代碼表示，使用第二個參數n時，endsWith的行為與其他兩個方法有所不同。它針對前n個字元，而其他兩個方法針對從第n個位置直到字元串結束。

 

 repeat()返回一個新的字元串能夠將原字元串重覆n次

console.log('★'.repeat(10))

三、數組的擴展

3.1 find和findIndex方法

數組實例的find方法，用於找出第一個符合條件的數組成員，它不會遍歷完整的數組。它的參數是一個回調函數，所有數組成員依次執行該回調函數，直到找出第一個返回值為true的成員，然後返回該成員，就結束。如果沒有符合條件的成員，則返回undefined。

let arr = [2,3,4,5,6,7,8,9,10,11,12];
let item = arr.find(function(item){
    return item > 7;
})
console.log(item)

 

數組的findIndex()方法的用法和find一樣，返回第一個符合條件的數組成員的下標位置，如果所有的成員都不符合，則返回-1。

let arr = [2,3,4,5,6,7,8,9,10,11,12];

let index = arr.findIndex(function(item){
    return item > 7;
})
console.log(index); //6

 

3.2 Array.from()方法

使用“...”可以類數組對象變為真正的數組。

什麼是類數組對象？就是對象的鍵名都是0、1、2、3、4...，並且有length屬性，可以被枚舉。

var obj = {
    0 : 100,
    1 : 200,
    2 : 300,
    length:3
}
var arr= Array.from(obj);
console.log(obj)
console.log(arr)

 

 

最常見的類數組對象是arguments：

function fun(){
    console.log([...arguments]);
}
fun(1,2,3,4)

3.3 Array.of()方法

它可以將零散的值變為數組

let arr = Array.of(3,4,5,6,7,8);
console.log(arr)

3.4 includes()方法

驗證數組中是否存在某一項：

let arr = [3,4,5,88,100];
console.log(arr.includes(88));  //true
console.log(arr.includes(888)); //false

該方法的第二個參數表示搜索的起始位置，預設為0。如果第二個參數為負數，則表示倒數的位置，如果這時它大於數組長度

（比如第二個參數為-4，但數組長度為3），則會重置為從0開始。

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

沒有該方法之前，我們通常使用數組的indexOf方法，檢查是否包含某個值。

 

indexOf方法有兩個缺點，一是不夠語義化，它的含義是找到參數值的第一個出現位置，所以要去比較是否不等於-1，表達起來不夠直觀。二是，它內部使用嚴格相等運算符（===）進行判斷，這會導致對NaN的誤判。

[NaN].indexOf(NaN)
// -1

 

includes使用的是不一樣的判斷演算法，就沒有這個問題。

[NaN].includes(NaN)
// true

3.5 fill()數組填充

var arr = new Array(10).fill("★");
console.log(arr)

3.6 for of遍歷

增加了一種數組的遍歷方法，叫for of遍歷，通常配合arr.entries()

var arr = ['白板','么雞','二條','三餅','四筒'];
for(var v of arr){
    console.log(v)
}

var arr = ['白板','么雞','二條','三餅','四筒'];
for(var [k,v] of arr.entries()){
    console.log(k,v)
}

四、ES6中函數的新特性

4.1箭頭函數（重點）

ES6 允許使用“箭頭”（=>）定義函數：

註意：

l => 是一個完整的運算符，不能拆開 = > 

l 箭頭函數一定是匿名函數，要使用“=”賦值接收某一個匿名的箭頭函數，來給這個匿名的箭頭函數命名。

 

函數的擴展：http://es6.ruanyifeng.com/#docs/function

l 【function的基本簡化】

const sum = function(a, b){
    return a + b;
}

 

等價於，現在用箭頭函數的定義：

const sum = (a, b)=>{
    return a + b;
}

 

【return和{}、()都可以簡化】

const sum = (a,b)=> a + b;
console.log(sum(4,5))

如果箭頭函數中，只有一條return語句時，可以簡化“{}”和return

言外之意：如果語句不止一條，必須加“{}”和return語句

 

如果箭頭函數形參變數中，只有一個參數，可以不寫形參變數的“()”圓括弧

const mianji = r => 3.14 * r * r
console.log(mianji(10))

 

如果箭頭函數不需要參數，就使用一個圓括弧代表參數部分。

const f = ()=> 5
// 等價於
const f = function(){
    return 5;
}

 

由於“{}”被解析為函數體，所以如果箭頭函數直接返回一個對象，必須在對象外加上圓括弧，否則報錯。

// const fun = (id,name)=> {"id": id, "name": name} //報錯
const fun = (id,name)=> ({"id": id, "name": name})

console.log(fun(10001,"小明"))

 

可以連續寫箭頭函數，表示函數的嵌套，外層的函數返回了一個函數。

const fun = a=> b=> a + b;
console.log(fun(10)(5))

 

等價於下麵兩種寫法：

const fun = (a)=>{
    return (b)=>{
        return a + b;
    }
}
function fun(a){
    return function(b){
        return a + b;
    }
}

註意：箭頭函數有幾個使用註意點。

（1）函數體內的this對象，就是定義時所在的對象，而不是使用時所在的對象。

（2）不可以當作構造函數，也就是說，不可以使用new命令，否則會拋出一個錯誤。

（3）不可以使用arguments對象，該對象在函數體內不存在。如果要用，可以用 rest 參數代替。

（4）不可以使用yield命令，因此箭頭函數不能用作 Generator 函數。

上面四點中，第一點尤其值得註意。this對象的指向是可變的，但是在箭頭函數中，它是固定的。

4.2函數的剩餘參數

ES6 引入 rest 參數（形式為...變數名），用於獲取函數的多餘參數，這樣就不需要使用arguments對象了。rest 參數搭配的變數是一個數組，該變數將多餘的參數放入數組中。

箭頭函數和普通函數一樣，也可以使用ES6的預設參數和剩餘參數：

const fun = (a,...b)=>{
    console.log(a)
    console.log(b)
}
fun(1,2,3,4,5,6);

4.3函數的預設參數

ES6允許為函數的參數設置預設值，即直接寫在參數定義的後面：

const sum = (a, b=10)=>{
    return a + b;
}
console.log(sum(3,4)); //7
console.log(sum(3)); //13

在函數的形參中賦值了預設值10，表示如果調用的時候沒有傳入b的值，預設值才會生效。

4.4箭頭函數的上下文

以前說的判斷上下文
規則1：直接圓括弧調用fn()，此時this是window
規則2：對象打點調用obj.fn()，此時this是obj
規則3：數組中枚舉函數調用arr[3]()，此時this是arr
規則4：定時器調用函數setInterval(fn , 10)，此時this是window
規則5：按鈕的事件監聽oBtn.onclick = fn，此時this是oBtn
規則6：call和allpay可以指定，fn.call(obj)，此時this是obj
規則7：用new調用函數，new fn()，此時this是秘密新創建的空白對象。
上面的規則，不適用於箭頭函數！

箭頭函數的上下文是什麼規則呢？

箭頭函數的上下文，是這個函數定義時所處的上下文，而不是看如何調用的。

箭頭函數定義時所在的函數內的this是誰，這個箭頭函數的this終身是誰，不能被改變。

 

 l 題目1：應用場景，之前定時器經常要進行備份，現在有箭頭函數就不需要備份了：

var obj = {
    a : 10,
    fn: function(){
        setInterval(()=>{
            console.log(this.a)
        },1000)
    }
}

obj.fn()

紅色這個函數的上下文是obj，此時箭頭函數的上下文就繼承自obj對象，而不是window。

 

l 題目2：fun函數裡面有一個箭頭函數，並且箭頭函數執行了

function fun(){
    const fn = ()=>{
        console.log(this.a)
    }
    fn();
}
var laowang = {
    a : 666,
    fun : fun
}
laowang.fun();

因為fun函數是laowang打點調用的，所以fun函數的上下文是laowang，此時箭頭函數的上下文就是laowang

因為箭頭函數的上下文，是箭頭函數定義時，所在函數的上下文。

 

l 相等於在外部備份了一次this：

function fun(){
    var self = this;
    const fn = function(){
        console.log(self.a)
    }
    fn();
}
var laowang = {
    a : 666,
    fun : fun
}
laowang.fun();

 

l 題目3：

var obj = {
    say : function(){
        var f1 = ()=>{
            console.log(this); //obj
            setTimeout(()=>{
                console.log(this); //obj
            })
        }
        f1();
    }
}

obj.say();

因為f1定義是所處的函數中的this指向obj，setTimeout的箭頭函數this繼承自f1，所以不管有多少層嵌套都是obj。

 

題目3的延伸：

var obj = {
    say : function(){
        var f1 = function(){
            console.log(this); //window
            setTimeout(()=>{
                console.log(this); //window
            })
        }
        f1();
    }
}

obj.say();

結果：window，因為箭頭函數在定義的時候它所處的環境相當於window，所以在箭頭函數內部的this就是window（node環境沒有window，可以在瀏覽器執行）

也就是說，箭頭函數的上下文取決於如何被定義，而不是如何被調用，正好和之前普通function相反。

進一步說，箭頭函數上下文不能被改變。

 

題目4：

function fun(){
    const fn = ()=>{
        console.log(this.a)
    }
    const xiaohua = {
        a : 9999999
    }

    fn.call(xiaohua); //call和apply都不能改變箭頭函數的上下文
}
var laowang = {
    a : 666,
    fun : fun
}
laowang.fun();

輸出還是laowang的a，就是666，箭頭函數上下文終身不能改。

箭頭函數不能被call、apply

 function還沒有下崗

如果需要一個可變的上下文函數，用function

如果需要一個自動備份外部上下文的函數，用箭頭函數

 

4.5 bind()綁定上下文

只有function能被bind()，箭頭函數不能被bind()

一個函數如果被bind()指向了某個對象，此時這個函數上下文將終身綁定到這個對象，永不改變，call、apply都沒有改變。

註意：bind()只綁定上下文，但不會執行函數，和call、apply不太一樣 

function fun(){
    console.log(this.a);
}

var laowang = {
    a : 666
}

var xiaozhang = {
    a : 8888
}

fun = fun.bind(laowang);  //fun函數的上下文終身在是laowang
fun();                        //即使圓括弧調用fun函數，也是laowang

fun.call(xiaozhang);        //call和apply也不能改變，還是laowang
fun.apply(xiaozhang);
fun = fun.bind(xiaozhang); //再次bind也無效，還是laowang
setInterval(fun,1000);      //定時器也不能改變它

只要寫一遍bind()，沒有任何方法可以改變函數的this指向。

 

4.6雙冒號運算符

箭頭函數可以綁定this對象，大大減少了顯式綁定this對象的寫法（call、apply、bind）。但是，箭頭函數並不適用於所有場合，所以現在有一個提案，提出了“函數綁定”（function bind）運算符，用來取代call、apply、bind調用。

函數綁定運算符是併排的兩個冒號（::），雙冒號左邊是一個對象，右邊是一個函數。該運算符會自動將左邊的對象，作為上下文環境（即this對象），綁定到右邊的函數上面。 

foo::bar;
// 等同於
bar.bind(foo);

foo::bar(...arguments);
// 等同於
bar.apply(foo, arguments);

4.7對象中函數的簡化

 

var result = Object.keys(obj).map(item=>({
    "label": item,
    "children" : obj[zimu].map(pinpai=>({
        "label" : pinpai.brand ,
        "children": pinpai.series.map(chexi=>({
            "label" : chexi
        }))
    }))
}));

 

 

 

var obj = {
    a : 100,
    fun : function(){
        console.log(this.a);
    }
}

 等價於：

var obj = {
    a : 100,
    fun(){
        console.log(this.a);
    }
}
obj.fun();

 

不等於：

var obj = {
    a : 100,
    fun:()=>{
        console.log(this.a);
    }
}
obj.fun();

4.8 babel翻譯它們

翻譯前

翻譯後

 

 

 

箭頭函數就是自動備份了this。

練習：下麵有一個對象，不改變原來的對象，創建新的obj2對象，將id為2那個車主的地區變為“中國”。

var obj1 = {
    "nowshow": 8,
    "nowType":"All",
    "dataArr":[
        {
            "id":1,
            "brand":"賓士",
            "price":50,
            "saler":{
                "name":"王尼瑪",
                "provice":"德國"
            }
        },
        {
            "id":2,
            "brand":"寶馬",
            "price":20,
            "saler":{
                "name":"李全蛋",
                "provice":"南韓"
            }
        }
    ]
};
練習 
var obj2 = {
    ...obj1,
    "dataArr":obj1.dataArr.map((item)=>{
        if(item.id == 2){
            return {
                ...item,
                saler:{
                    ...item.saler,
                    provice:"中國"
                }
            }
        }

        return item;
    })
}
console.log(JSON.stringify(obj2))
答案

五、類（構造函數）

5.1 ES6類的新寫法

原來定義一個類，是用構造函數，用new調用。
您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • VUE 實現複製內容到剪貼板功能
    註： 依賴第三方插件 clipboard 一、安裝插件 二、全局註入（main.js） 三、使用 四、效果圖 ...
  • D3.js的一些基礎部分
    最近公司有需求要做一些可視化的功能。之前一直都是用Echarts做的，但是Echarts現在滿足不了我們的需求，經過多方請教，查找發現只有D3可以滿足我們的需求，而且可以完美的適用到react框架中。第一次接觸到D3，發現這些圖標的可交互性非常豐富，而且動畫流暢簡潔。 所以，打算學習D3並且應用到項 ...
  • JS 圖片放大鏡
    今天練習一個小demo, 從本地讀取圖片， 然後實現類似淘寶放大鏡的效果， 再加兩個需求 1 .可以調節縮放比例，預設放大兩倍 2 . 圖片寬高自適應， 不固定寬高 話不多說先看效果： 原理：1， 右側放大區域的大小等於左側半透明滑塊大小乘以縮放倍數 2， 右側放大區域圖片的原始尺寸要和 左側圖片一 ...
  • JS控制上傳文件個數
    <html><body> <h3>js控制文件上傳數量</h3> <form action="" enctype="multipart/form-data"> <input type="file" name="file" multiple="multiple" onchange="fileCount ...
  • 【js】走近小程式
    一、什麼是小程式？ 基於微信的可以為用戶提供一些服務的web項目，利用微信提供的介面可以讓所有開發者使用到微信的原生能力，去完成一些之前做不到或者難以做到的事情。 二、小程式開發工具以及語言？ 小程式需要用到微信提供的小程式開發工具，​小程式的主要開發語言是 JavaScript 。 三、小程式與普 ...
  • 小程式的三級聯動
    項目中經常遇到要選擇城市。用到三級聯動的方式 微信小程式的 組件 是三級聯動的，但是無法自定義，這讓我們心痛不已，值得我們欣慰的 picker view 組件是可以自定義添加多個選項，但還是無法聯動。既然這樣那就自己寫一個聯動。 做到如下圖所示： 分為動態獲取地址 引用靜態文件獲取地址 <! mor ...
  • d3js scales深入理解
    轉自：https://www.cnblogs.com/kidsitcn/p/7182274.html 比例尺函數是這樣的javascript函數： 接收通常是數字，日期，類別等data輸入並且： 返回一個代表可視化元素的值，比如坐標，顏色，長度或者半徑等 比例尺通常用於變換(或者說映射）抽象的數據值 ...
  • 前端實現文件線上預覽txt，pdf，doc，xls，ppt幾種格式
    做法就是使用iframe標簽 1.text，pdf的文件預覽 <iframe class="filename" :src="文件的地址" width='100%' height='600' frameborder='1' ></iframe> 2.doc,xls,ppt等office的預覽 <ifr ...
一周排行
    -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.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類