js中一些容易混淆的方法

来源:http://www.cnblogs.com/hcy1996/archive/2016/10/16/5967048.html
-Advertisement-
Play Games

JavaScript中有一些名字十分冗長的函數名稱,導致使用時會混亂,特此整理一番,加深印象。 ①Object.getOwnPropertyDescriptor ——讀取某個對象特定屬性的屬性描述符(value / writable / enumerable / configurable) 這個方法 ...


JavaScript中有一些名字十分冗長的函數名稱,導致使用時會混亂,特此整理一番,加深印象。

Object.getOwnPropertyDescriptor     ——讀取某個對象特定屬性的屬性描述符(value / writable / enumerable / configurable)

這個方法接受兩個參數:(屬性所在對象  , 要讀取其描述符的屬性名稱),返回值是一個對象。

 

var o = Object.getOwnPropertyDescriptor({x : 1}, 'x');
//{value:1, writable:true, enumerable:true, configurable:true} alert(o); // [object Object]

 

此方法只能取得自身的屬性描述符,無法獲得繼承屬性的特性:

var o = Object.getOwnPropertyDescriptor({}, 'toString');
alert(o); //undefined

 

 

 

 ②Object.defineProperty  ——設置某個對象(單個)屬性的特性或讓新建屬性具有某種特性

這個方法接受三個參數:(要修改的對象 , 要創建或修改的屬性 、 屬性描述符對象)。

 

 var o = {};
            Object.defineProperty(o, 'x', {
                value : 1,
                writable : true,
                enumerable : false,
                configurable : true
            });
            alert(o.x);   //  1
            
            Object.defineProperty(o, 'x', {writable : false});
            o.x = 2;   //不可行,不會報錯,但不會修改, o.x = 1;
            
            Object.defineProperty(o, 'x', {value : 2});
            alert(o.x);   //  2         

 

 

Object.defineProperties  ——  設置某個對象(多個)屬性的特性或讓新建屬性具有某種特性

這個方法接受兩個參數:(修改的對象 , 映射表--包含所有新建或者修改屬性的名稱和屬性描述符)。

Object.defineProperties({}, {
                _year : {
                    value : 2016,
            writable : true, 
enumerable : true,
configurable : true }, edition : { value :
1 }, year : { get : function(){ return this._year; }, set : function(newValue){ if(newValue > 2004){ this._year = newValue; this.edition += newValue - 2004; } } } });

以上在一個空對象中定義了兩個數據屬性(_year和edition),還有一個訪問器屬性(year),這裡額屬性都是同一時間創立。

 

isPrototypeOf  ——確定對象與原型之間存在的關係

function Person(){}
            
            var friend = new Person();
            alert(Person.prototype.isPrototypeOf(friend));  //true

因為friend對象內部有一個指向Person.prototype的指針,所以返回true。

 

Object.getPrototypeOf  ——方便地取得一個對象的原型

function Person(){}
            Person.prototype.name = 'Tom';
            
            var friend = new Person();
            alert(Object.getPrototypeOf(friend) == Person.prototype);  // true
            alert(Object.getPrototypeOf(friend).name);  // Tom

ES5中新增的方法,IE9+支持。

 

hasOwnProperty  ——檢測一個屬性是存在於實例中,還是存在於原型中

function Person(){}
            Person.prototype.name = 'Tom';
            Person.prototype.sayName = function(){
                alert(this.name);
            };
            
            var frient1 = new Person();
            frient1.name = 'Jery';
            var frient2 = new Person();
            
            alert(frient1.hasOwnProperty('name'));
            alert(frient2.hasOwnProperty('name'));

使用hasOwnProperty()可以輕鬆知曉訪問的是實例屬性還是原型屬性了。

 


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

-Advertisement-
Play Games
更多相關文章
  • 字體絕對是每一個設計非常重要的部分,設計者總是希望有最好的免費字體,以保持他們字體庫的更新。所以今天我要向設計師們分享一組用於簡潔網頁設計的光滑英文字體。這些免費的字體是適用於各種類型的設計,除了網頁,還有海報、標誌、印刷廣告等。 ...
  • 今天的這篇文章還是一篇“Hello World”,只不過開發環境有所改變——Visual Studio Code+Angular2+Webapck,也算是正式的開篇了。 一、新建一個文件夾作為此次Demo的根目錄,這裡為:“F:\Visual Studio Code\app1”,併在“命令提示符中打 ...
  • AJAX即“Asynchronous Javascript And XML”(非同步JavaScript和XML)。 個人理解:ajax就是無刷新提交,然後得到返回內容。 對應的不使用ajax時的傳統網頁如果需要更新內容(或用php做處理時),必須重載整個網頁頁面。 示例: html代碼如下 ./te ...
  • 本系列文章導航 從零開始學習jQuery (一) 入門篇 一.摘要 本系列文章將帶您進入jQuery的精彩世界, 其中有很多作者具體的使用經驗和解決方案, 即使你會使用jQuery也能在閱讀中發現些許秘籍. 本篇文章是入門第一篇, 主要是簡單介紹jQuery, 通過簡單示例指導大家如何編寫jQuer ...
  • 子元素避免同時使用float和margin。 如: 需要子元素的margin-bottom:20px時,可以給用父元素設置padding-bottom:20px代替。 ...
  • 1.meta標簽。 1.1 <meta charset="utf-8"> charset:字元集 1.2 <meta name="keywords" content=""> 作用:對網站進行優化的作用 SEO 提高排名。 1.3 <meta name="description" content="" ...
  • 作為web前端初學者,今天要記錄的是三個控制項的使用心得,分別是表格控制項jqgrid,樹形控制項ztree,圖表控制項echarts。下邊分別進行描述。 1.jqgrid 首先放官方demo網站上來,http://blog.mn886.net/jqGrid/,上面的描述還是挺有幫助的。 jqgrid的添加 ...
  • 每學習一些新的東西,要學會複習,總結和記錄。 今天來簡單總結一下學到的幾個事件:焦點事件、Event事件對象、冒泡事件 其實這幾個事件應該往深的說是挺難的,但今天主要是以一個小菜的角度去嘗試理解一些基本的知識點。 1.焦點事件: 1.1概念理解: 想象場景:當一堆text文本框出現在面前,當點擊其中 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 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 ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...