JavaScript學習總結(三)——this、原型、javascript面向對象

来源:http://www.cnblogs.com/best/archive/2016/12/26/6221174.html
-Advertisement-
Play Games

一、this 在JavaScript中this表示：誰調用它，this就是誰。 JavaScript是由對象組成的，一切皆為對象，萬物皆為對象。this是一個動態的對象，根據調用的對象不同而發生變化，當然也可以使用call、apply修改this指向的對象。它代表函數運行時，自動生成的一個內部對象， ...


一、this

在JavaScript中this表示：誰調用它，this就是誰。

JavaScript是由對象組成的，一切皆為對象，萬物皆為對象。this是一個動態的對象，根據調用的對象不同而發生變化，當然也可以使用call、apply修改this指向的對象。它代表函數運行時，自動生成的一個內部對象，只能在函數內部使用

1.1、JavaScript中函數與方法的區分

在面向過程的語言中我們習慣把完成某個特定功能的代碼塊稱為“函數”或“過程”，當然過程一般沒有返回值。在面向對象語言中我們把對象的功能稱為“方法”。但JavaScript是種介於面向對象與面向過程中間的語言，同樣的方法有時是函數，有時是方法，如下所示：

<script type="text/javascript">
            //1
            function show(){
                console.log("這是一個函數");
            }
            
            //2
            (function(){
                console.log("這是一個函數表達式");
            })();
            
            //3
            var obj1={
                show:function(){
                    console.log("這是一個方法");
                }
            };
            
            //4
            function obj2(){  //obj2是函數，構造函數
                this.show=function(){
                    console.log("這是一個方法，是一個表達式");
                }
            }
            var obj3=new obj2();
            
        </script>

可以簡單的認為如果調用時沒有通過對象沒有指定上下文則為函數，否則為方法。

1.2、指向全局對象

當在全部範圍內使用 this，它將會指向全局對象。一般是window對象，但全局對象不一定只有window，特別是在node.js環境中。作為函數調用時一般指向全局對象。

        <script type="text/javascript">
            var name="tom";
            console.log(this.name);      //頂層對象，一般為window    
            
            function show()
            {
                console.log(this.name);  //頂層對象，一般為window
                return function(){
                    console.log(this.name);  //頂層對象，一般為window，因為返回的是函數
                }
            }
            
            var f1=show();
            f1();
            
        </script>

運行結果：

1.3、作為方法調用

當函數作為方法調用時this指向調用該方法的對象。

            function show()
            {
                //當obj1.view()時this就是obj1，obj2.view()時this就是obj2
                console.log(this.name);
            }
            
            var obj1={name:"jack",view:show};
            obj1.view();
            
            var obj2={name:"mark",view:show};
            obj2.view();

運行結果：

示例代碼：

        <script type="text/javascript">
            var name="lucy";
            this.name="Mali";
            function show()
            {
                //當obj1.view()時this就是obj1，obj2.view()時this就是obj2
                console.log(this.name);
                
                return function(){
                    console.log(this.name);  //這裡的this是調用時動態決定
                }
            }
            
            var obj1={name:"jack",view:show};
            obj1.view();
            
            var obj2={name:"mark",view:show};
            var f1=obj2.view();
            f1();  //因為f1屬於window（瀏覽器環境），調用f1時的this也就是window
            
        </script>

運行結果：

示例代碼：

        <script type="text/javascript">
            var name="lucy";
            this.name="Mali";
            function show()
            {
                //當obj1.view()時this就是obj1，obj2.view()時this就是obj2
                console.log(this.name);
                that=this;  //閉包
                return function(){
                    console.log(that.name);  //這裡的that指向的是外層函數調用時的對象
                }
            }
            
            var obj1={name:"jack",view:show};
            obj1.view();
            
            var obj2={name:"mark",view:show};
            var f1=obj2.view();
            f1();            
        </script>

運行結果：

1.4、在構造函數中的this

構造函數中的this指向新創建的對象，new出誰this就是誰。

示例代碼：

<script type="text/javascript">
            this.name="吉娃娃";
            function Dog(name)
            {
                this.name=name;
                this.bark=function(){
                    console.log(this.name+"在叫，汪汪...");
                }
            }
            
            var dog1=new Dog("哈士奇");
            dog1.bark();
</script>

運行結果：

按照嚴格的語法，構造函數不應該返回值，但是JavaScript是允許構造方法返回值的，預設返回this，修改後的示例如下：

            this.name="吉娃娃";
            function Dog(name)
            {
                this.name=name;
                this.bark=function(){
                    console.log(this.name+"在叫，汪汪...");
                }
                return this.bark;
            }
            
            var dog1=new Dog("哈士奇");
            dog1();

運行結果：

 

1.5、指定this指向的對象

當調用方法是通過Function.call，或Function.apply時this為調用時指定的對象，如果沒有指定則為頂層對象，瀏覽器中是window。

示例代碼：

            this.name="伽啡";
            function Cat(name)
            {
                this.name=name;
            }
            var bark=function(n){
                console.log(this.name+"叫了"+(n||1)+"聲喵喵...");
            }
            
            var cat1=new Cat("波斯");
            var cat2=new Cat("龍貓");
            
            bark.call(cat1,5);  //調用時this是cat1
            bark.apply(cat2,[8]);  //調用時this是cat2
            bark.apply(window,[9]);  //調用時this是window
            bark.apply();  //調用時this是頂層對象

 

運行結果：

1.6、作為事件時的this

如果頁面中的元素與事件進行綁定時事件中的this一般指向網頁元素，如按鈕，文本框等。但是在元素中直接指定要執行的函數則this指向window頂層對象。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>this</title>
    </head>
    <body>
        <input type="button" value="按鈕A" class="btn"/>
        <input type="button" value="按鈕B" class="btn"/>
        <input type="button" value="按鈕C" class="btn"/>
        <input type="button" value="按鈕D" onclick="handler()"/>
        <!--handler中的this指向window或頂層對象-->
        <input type="button" value="按鈕E" id="btnE"/>
        <script type="text/javascript">
            var buttons = document.querySelectorAll(".btn");
            
            for (var i=0;i<buttons.length;i++) {
                //handler中的this指向按鈕對象
                buttons[i].onclick=handler;
            }
            
            function handler(){
                    alert(this.value);
            }
            
            //handler中的this指向btnE
            document.getElementById("btnE").addEventListener("click",handler,false);
        </script>
    </body>
</html>

當點擊A-C時的效果：

當點擊D時的效果：

 

當點擊按鈕E時的效果：

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title>this</title>
    </head>

    <body>
        <input type="button" value="按鈕F的值" id="btnF" />
        <input type="button" value="按鈕G的值" id="btnG" onclick="app.show()"/>
        <script type="text/javascript">
            value="window的值"
            var app = {
                value: "app的值",
                show: function() {
                    alert(this.value); //如果show為事件，則this指向觸發事件的對象
                },
                init: function() {
                    //handler中的this指向btnE
                    document.getElementById("btnF").addEventListener("click", this.show, false);
                }
            };
            
            app.show();   //"app的值"，show方法中的this指向app這個對象
            app.init();     //init中的this指向誰app對象
            
            
        </script>
    </body>
</html>

 載入時運行結果：

點擊按鈕F時的效果：

點擊按鈕G時的效果：

 

在HTML元素上直接指定事件嚴格來說都不能說是事件綁定，只能描述是當按鈕點擊完成後執行的函數。如果想將執行時的對象帶回，可以增加參數this。

1.7、小結

函數調用可以如下幾種基本形式：

1)、fun(x,y);

2)、obj.fun(x,y);

3)、fun.apply(obj,[x,y]);

4)、fun.call(obj,x,y);

第1，2種調用的方式最終將轉換成3，4方法，也就是說1，2只是一種簡化的語法糖，那麼this就是apply與obj的第1個參數，指向調用時的上下文。

二、原型（prototype）

JavaScript是一種通過原型實現繼承的語言與別的高級語言是有區別的，像java，C#是通過類型決定繼承關係的，JavaScript是的動態的弱類型語言，總之可以認為JavaScript中所有都是對象，在JavaScript中，原型也是一個對象，通過原型可以實現對象的屬性繼承，JavaScript的對象中都包含了一個" prototype"內部屬性，這個屬性所對應的就是該對象的原型。

"prototype"作為對象的內部屬性，是不能被直接訪問的。所以為了方便查看一個對象的原型，Firefox和Chrome內核的JavaScript引擎中提供了"__proto__"這個非標準的訪問器（ECMA新標準中引入了標準對象原型訪問器"Object.getPrototype(object)"）。

1.1、為什麼需要prototype

現在有一個Student構造函數，通過new調用該構造函數可以創建一個新的對象，示例如下：

            //構造方法，用於創建學生對象
            function Student(name) {
                this.name = name;
            }
            
            var tom=new Student("tom");
            tom.show=function(){
                console.log(this.name);
            }
            
            var rose=new Student("rose");
            rose.show=function(){
                console.log(this.name);
            }
                        
            tom.show();
            rose.show();

運行結果：

上面的示例中tom與rose都需要show方法，創建對象後我們直接為兩個對象分別都增加了show方法，但是這樣做的弊端是如果再增加更多對象也需要添加show方法，最好的辦法是修改構造方法Student，如下所示：

            //構造方法，用於創建學生對象
            function Student(name) {
                this.name = name;
                this.show = function() {
                    console.log(this.name);
                }
            }

            var tom = new Student("tom");
            var rose = new Student("rose");

            tom.show();
            rose.show();

但是如果Student構造函數是一個內置的函數或是其它框架定義的類型，則修改就比較麻煩了，可以不修改源碼的情況擴展該對象的原型也可以達到目的，如下所示：

            //構造方法，用於創建學生對象
            function Student(name) {
                this.name = name;
            }
            
            //修改Student對象的原型，增加show方法
            Student.prototype.show = function() {
                console.log(this.name);
            }
            
            var tom = new Student("tom");
            var rose = new Student("rose");

            tom.show();
            rose.show();

在示例中我們並沒有修改Student這個構造函數而是修改了了Student的原型對象，類似它的父類，如下圖所示：

此時你也許會認為所有的Object都增加了show方法，這樣想是錯誤的，因為Student的原型是一個對象而不是像其它高級語中的類型，我們修改的只是Student的原型對象，不會影響其它的對象。

            var mark=new Object();
            mark.name="mark";
            
            var lucy={name:"lucy"};
            //mark.show();
            //lucy.show();

此處的兩個show方法是錯誤的。總之原型的主要作用就是為了實現繼承與擴展對象。

1.2、typeof與instanceof

1.2.1、typeof

在 JavaScript 中，判斷一個變數的類型可以用typeof，如：

             var str1="Hello";
             var str2=new String("Hello");
             
            console.log(typeof 1);
            console.log(typeof(true));
            console.log(typeof str1);
            console.log(typeof str2);
            console.log(typeof([1,2,3]));
            console.log(typeof Date);
            console.log(typeof undefined);
            console.log(typeof null);
            console.log(typeof zhangguo);

運行結果：

1)、數字類型， typeof 返回的值是 number。比如說：typeof(1)，返回值是number
2)、字元串類型， typeof 返回的值是 string。比如typeof("123")返回值是string。
3)、布爾類型， typeof 返回的值是 boolean 。比如typeof(true)返回值是boolean。
4)、對象、數組、null 返回的值是 object 。比如typeof(window)，typeof(document)，typeof(null)返回的值都是object。
5)、函數類型，返回的值是 function。比如：typeof(eval)，typeof(Date)返回的值都是function。
6)、不存在的變數、函數或者undefined，將返回undefined。比如：typeof(abc)、typeof(undefined)都返回undefined。

1.2.2、instanceof

使用 typeof 運算符時採用引用類型存儲值會出現一個問題，無論引用的是什麼類型的對象，它都返回 "object"。ECMAScript 引入了另一個 Java 運算符 instanceof 來解決這個問題。instanceof 運算符與 typeof 運算符相似，用於識別正在處理的對象的類型。與 typeof 方法不同的是，instanceof 方法要求開發者明確地確認對象為某特定類型。

instanceof用於判斷某個對象是否被另一個函數構造。

例如：
var oStringObject = new String("hello world");
console.log(oStringObject instanceof String); // 輸出 "true"

             var str1="Hello";
             var str2=new String("Hello");
             
            console.log(str1 instanceof String);   //string false
            console.log(str2 instanceof String);  //object true
            
            console.log(1 instanceof Number); //false
            
            function Foo(){};
            
            var f1=new Foo();
            console.log(f1 instanceof Foo);

運行結果：

1.3、Function與Object

1.3.1、Function

函數就是對象,代表函數的對象就是函數對象。所有的函數對象是被Function這個函數對象構造出來的。Function是最頂層的構造器。它構造了系統中所有的對象，包括用戶自定義對象，系統內置對象，甚至包括它自已。這也表明Function具有自舉性(自已構造自己的能力)。這也間接決定了Function的call和constructor邏輯相同。每個對象都有一個 constructor 屬性,用於指向創建其的函數對象。

先來看一個示例：

            function Foo(a, b, c) {  //Foo這個構造函數由Function構造，函數也是對象
                return a * b * c;
            }
            
            var f1=new Foo();   //f1由Foo構造，Foo是一個構造函數，可以理解為類
            
            console.log(Foo.length);   //參數個數 3
            console.log(typeof Foo.constructor);  //function
            console.log(typeof Foo.call);  //function
            console.log(typeof Foo.apply);  //function
            console.log(typeof Foo.prototype);  //object object

運行結果：

 

函數與對象具有相同的語言地位
沒有類,只有對象
函數也是一種對象,所謂的函數對象
對象是按引用來傳遞的

            function Foo() {};
            var foo = new Foo();
            //Foo為foo的構造函數，簡單理解為類型
            console.log(foo instanceof Foo); // true
            
            //但是Function並不是foo的構造函數
            console.log(foo instanceof Function); // false
            
            //Function為Foo的構造函數
            alert(Foo instanceof Function); //true

上面的代碼解釋了foo和其構造函數Foo和Foo的構造函數Function的關係，Foo是由Function構造得到，可以簡單理解為，系統中有一個這樣的構造函數：

            function Function(name,body)
            {
            }
            
            var Foo=new Function("Foo","");

1.3.2、Object

對於Object它是最頂層的對象，所有的對象都將繼承Object的原型，但是你也要明確的知道Object也是一個函數對象，所以說Object是被Function構造出來的。

alert(Function instanceof Function);//true 
alert(Function instanceof Object);//true 
alert(Object instanceof Function);//true 

function Foo() {};
var foo = new Foo();
alert(foo instanceof Foo); // true
alert(foo instanceof Function); // false
alert(foo instanceof Object); // true
alert(Foo instanceof Function); // true
alert(Foo instanceof Object); // true

 

JavaScript 原型鏈

            function A() {this.x="x";};
            var a=new A();
            
            function B() {this.y="y"};
            B.prototype=a;
            var b=new B();
            
            function C() {this.z="z"};
            C.prototype=b;
            var c=new C();
            
            console.log(c instanceof C);
            console.log(c instanceof B);
            console.log(c instanceof A);
            console.log(c instanceof Object);
            
            console.log(c.x+","+c.y+","+c.z);

運行結果：

1.4、通過prototype擴展對象

JavaScript內置了很多對象，如Array、Boolean、Date、Function、Number、Object、String 

假設我們想給String類型增加一個repeat方法，實現重覆字元，如"a".rpt()，則將輸出aa，"a".rpt(5),輸出“aaaaa”，因為String是JavaScript中內置的對象，可以通過修改該對象的原型達到目的：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>prototype原型</title>
    </head>
    <body>
        <script type="text/javascript">
            var v="hi";
            
            String.prototype.rpt=function(n)
            {
                n=n||2;
                var temp="";
                for(var i=0;i<n;i++) temp+=this;
                return temp;
            }
            
            console.log(v.rpt());
            console.log(v.rpt(10));
        </script>
    </body>
</html>

運行結果：

示例中給String對象的原型增加了一個rpt方法，所有的String都是衍生自String.prototype，那所有的String對象都將獲得rpt方法。

            //擴展String類型，增加trim方法用於刪除字元串的首尾空格
            String.prototype.trim=function()
            {
                return this.replace(/^\s+|\s+$/igm,'');
            }
            
            console.log("[begin]"+"  Hello JavaScript  ".trim()+"[end]");

運行結果：

為了擴展更加方便，可以修改Function的原型，給每一個函數衍生的對象增加方法method用於擴展。

            //修改函數對象的原型，添加method方法，擴展所有的函數
            Function.prototype.method=function(name,fun){
                //如果當前擴展的函數的原型中不包含名稱為name的對象
                if(!this.prototype[name]){
                    //添加
                    this.prototype[name]=fun;
                }
            }
            
            String.method("show",function(){
                console.log("輸出："+this);
            });
            
            "Hello".show();
            "JavaScript".show();

運行結果：

1.5、通過prototype調用函數

我們可以通過對象調用某個方法，因為這個對象的原型中已經定義好了該方法，其實我們通過原型也可以直接調用某個方法，有些方法只存在原型中，只有當前類型關聯了該原型才可以獲得該方法，但有時我們需要使用該方法去處理非該原型下的對象，如：

            function add(x,y,z)
            {
                var array1=[].slice.call(arguments,0,3);
                console.log(array1);
                var array2=Array.prototype.slice.apply(arguments,[0,3]);
                console.log(array2);
            }
            add(1,2,8,9,10);

運行結果：

示例代碼：

            var str1 = "Hello JavaScript";
            console.log(str1.toUpperCase()); //傳統的調用辦法

            var str2=String.prototype.toUpperCase.apply(str1); //通過原形直接調用
            console.log(str2);
            
            var str3=String.prototype.toUpperCase.call(str1); //通過原形直接調用
            console.log(str3);
            
            var array1=[2,3,5,7,8,9,10];
            var array2=array1.slice(1,3);
            console.log(array2);
            
            var slice=Array.prototype.slice;
            console.log(slice.apply(array1,[1,3]));//通過原形直接調用
            console.log(slice.call(array1,1,3));

運行結果：

練習：擴展Date，增加一個顯示中文日期的方法，如：new Date().trandition()，輸出2016年08月09日 23點15分18秒；使用prototype的方式間接調用該方法。

三、JavaScript面向對象（OOP）

3.1、封裝

            function Animal()
            {
                this.name="動物";
                this.getName=function(){
                    return this.name;
                }
                this.setName=function(name){
                    this.name=name;
                }
                this.bark=function(){
                    console.log(this.name+"在叫...");
                }
            }
            var animal=new Animal();
            animal.setName("小狗");
            animal.bark();

這裡定義的一個構造函數，將name封裝成屬性，Animal函數本身用於封裝動物的屬性與行為，運行結果：

3.2、繼承

JavaScript的繼承的實現主要依靠prototype(原型)來實現，再增加兩個動物，如狗與貓：

            function Animal()
            {
                this.name="動物";
                this.getName=function(){
                    return this.name;
                }
                this.setName=function(name){
                    this.name=name;
                }
                this.bark=function(){
                    console.log(this.name+"在叫...");
                }
            }
            
            function Dog(){
                this.hunt=function(){console.log("狗在捕獵");};
            }
            //指定Dog構造函數的原型對象，簡單理解為父類
            Dog.prototype=new Animal();
            
            function Cat(){
                this.hunt=function(){console.log("貓在抓老鼠");};
            }
            Cat.prototype=new Animal();
            
            var dog=new Dog();
            dog.bark();
            dog.hunt();
            
            var cat=new Cat();
            cat.bark();
            cat.hunt();

運行結果：

3.3、多態

java與C#中的多態主要體現在重載與重寫上，因為JavaScript是弱類型的，類方法參數是動態指定的所以並沒有真正意義上的重載，只能在方法中判斷參數達到目的。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>JavaScript面向對象</title>
    </head>
    <body>
        <script type="text/javascript">
            function Animal()
            {
                this.name="動物";
                this.getName
您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • Javascript高性能編程-提高javascript載入速度
    1、將所有<script>標簽放在儘可能接近<body>標簽底部的位置，以保證頁面在腳本運行之前完成解析儘量減少對整個頁面下載的影響 2、限制頁面的<script>總數也可以改善性能。每當頁面解析碰到一個<script>標簽時， 緊接著有一段時間用於代碼執 行。最小化這些延遲時間可以改善頁面的整體性 ...
  • 微信小程式
    最近在看微信小程式邊看邊寫demo，整體目錄結構是一：app.js，app.json，app.wxss這三個文件必須是放在根目錄下，二、一個小程式有多個頁面組成，其中每個頁面的結構是：page.js，page.json，page.wxml，page.wxss。 這些文件尾碼名都是微信小程式特定的，其 ...
  • javascript 表單
    在HTML中，表單是由<form>元素來組成的。在js中，表單對應的則是HTMLFormElement類型。它和其他HTML元素一樣具有相同的預設屬性。下麵是HTMLFormElement獨有的屬性和方法： acceptCharset:伺服器能夠處理的字元集，等價於HTML的accept-chars ...
  • js—模糊查詢
    首先要明白什麼是模糊查詢（廢話又來了），就是根據關鍵字把列表中符合關鍵字的一項或某項羅列出來，也就是要檢查列表的每一項中是否含有關鍵字，因此抽象一下就是一個字元串中是否含有某個字元或者字元串。 以下例子沒有接觸到後臺數據的知識，只是查詢當前表格中每一行所包含的關鍵字。 用到的方法為：string.i ...
  • 如何在Node.js中合併兩個複雜對象
    通常情況下，在Node.js中我們可以通過underscore的extend或者lodash的merge來合併兩個對象，但是對於像下麵這種複雜的對象，要如何來應對呢？ 例如我有以下兩個object： 希望合併之後的結果輸出成下麵這樣： 通過underscore或者lodash現有的方法我們無法實現上 ...
  • transformjs污染了DOM?是你不瞭解它的強大
    原文鏈接: https://github.com/AlloyTeam/AlloyTouch/wiki/Powerful transformjs 寫在前面 上星期在React微信群里，有小伙伴覺得transformjs直接給DOM添加屬性太激進，不可取（由於不在那個微信群，不明白為什麼React會談到 ...
  • 【乾貨分享】前端面試知識點錦集05（目錄篇）
    五、目錄篇 一、HTML部分1、瀏覽器頁面有哪三層構成，分別是什麼，作用是什麼?2、HTML5的優點與缺點？3、Doctype作用? 嚴格模式與混雜模式如何區分？它們有何意義?4、HTML5有哪些新特性、移除了哪些元素？5、你做的網頁在哪些流覽器測試過,這些瀏覽器的內核分別是什麼?6、每個HTML文... ...
  • 經典的一款jQuery soChange幻燈片
    soChange一款多很經典的幻燈片的jQuery插件。 實例預覽 引入文件 <link rel="stylesheet" type="text/css" media="all" href="style.css" /> <script type="text/javascript" src="jque ...
一周排行
    -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.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類