JavaScript對象常用操作方法

IT那活兒發布于2023-01-11 13:20 / 745人閱讀

JavaScript對象常用操作方法

點擊上方“IT那活兒”，關注后了解更多內容，不管IT什么活兒，干就完了！！！

什么是對象

在JavaScript中對象是一組元素的相關屬性和方法的集合，所有的事物都是對象，例如：日期，字符串，數字，數組，布爾，函數等。

對象是由屬性和方法組成的:

屬性：事物的特征,在對象中用屬性來表示(常用名詞)
方法：事物的行為,在對象中用方法來表示(常用動詞)

創建對象的三種方式

方式一：利用對象字面量創建對象{}

var person = {

  username: "紀云禾",

  age: 600,

  sex: "女",

};

alert(person.username);

方式二：利用new object創建對象

var csm = new Object(); //創建了一個空的對象

csm.userName = "紀云禾";

csm.age = 600;

csm.sex = "女";

// (1) 我們是利用等號=賦值的方法添加對象的屬性和方法

// (2) 每個屬性和方法之間用分號結束

console.log(csm.userName);

console.log(csm["sex"]);

方式三：利用構造函數創建對象

構造函數: 是一種特殊的函數,主要用來初始化對象,即為對象成員變量賦初始值,它總與new運算符一起使用。

我們可以把對象中一些公共的屬性和方法抽取出來，然后封裝到這個函數里面。

//我們需要創建四大天王的對象相同的屬性: 名字 年齡性別相同的方法: 唱歌

//構造函數的語法格式

function 構造函數名() {

this.屬性=值;

this.方法= function() {}

}

new 構造函數名();

function Test(username, age, sex) {

  this.name = username;

  this.age = age;

  this.sex = sex;

  this.sing = function (sang) {

    console.log(sang);

  };

}

var jyh = new Test("紀云禾", 600, "女"); //調用函數返回的是一個對象

console.log(jyh.name);

console.log(jyh["sex"]);

ldh.sing("與君初相識");

var cy = new Test("長意", 700, "男");

console.log(cy.name);

console.log(cy.age);

ldh.sing("與君初相識");

構造函數名字首字母要大寫；
我們構造函數不需要return就可以返回結果；
我們調用構造函數必須使用new；
我們只要new Star() 調用函數就創建一個對象ldh {}；
我們的屬性和方法前面必須添加this。

定義對象的兩種方式

(1) var obj =new Object();

(2) per = {}

自定義構造函數

function Test(userName, age, job) {

    this.name = userName;

    this.age = age;

    this.job = job;

    sayName = function () {

      alert(this.name);

     };

  }

  var jyh = new Person(jyh, 600, "actor");

  var cy = new Person(cy, 500, "actor");

new關鍵詞

new在執行時會做四件事情：

在內存中創建一個新的空對象；
讓this指向這個新的對象；
執行構造函數里面的代碼，給這個新對象添加屬性和方法；
返回這個新對象所以構造函數里面不需要return。

遍歷對象

//遍歷對象

var jyh = {

  userName: "紀云禾",

  age: 600,

  sex: "女",

  fn: function () {},

};

// for in遍歷對象

//for(變量in對象){

// }

for (var k in jyh) {

  console.log(k); // k變量輸出得到的是屬性名

  console.log(jyh[k]); //jyh[k]得到是屬性值

}

//我們使用for in里面的變量我們喜歡寫k或者key

END

本文作者：池思敏

本文來源：IT那活兒（上海新炬王翦團隊）

云服務器 GPU云服務器 javascript對象方法 Excel常用操作 linux常用操作 query常用方法

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/129526.html

JavaScript：對Object對象的一些常用操作總結

摘要：一可以用作對象的復制可以用作對象的合并注意目標對象自身也會改變。對象四返回一個數組，包括對象自身的不含繼承的所有可枚舉屬性不含屬性的鍵名。該方法返回被凍結的對象。方法判斷一個對象是否被凍結。 JavaScript對Object對象的一些常用操作總結。一、Object.assign() 1.可以用作對象的復制 var obj = { a: 1 }; var copy = Object....

馬龍駒 2019-08-23 12:46 評論0 收藏0
常用JavaScript操作CSS方法總結

摘要：返回值一個對象集合，包含六個屬性上下左右寬高注意只用于行內元素只能獲取樣式只讀獲取元素位置獲得頁面中某個元素的左，上，右和下分別相對瀏覽器視窗的位置。返回一個類數組對象，其包含樣式表中所有規則。 [TOC] 獲取樣式元素對象的寬高位置距離等屬性如offsetWidht、cilentWidht、scrollWidth…… let oWidth=obj.offsetWidth; 注意...

enali 2019-08-21 18:19 評論0 收藏0
javascript中常用的對象操作方法

摘要：返回組成的數組返回對象的組成的數組返回一個由組成的數組，其元素是在對象上找到的可枚舉屬性值。深拷貝對象返回深拷貝的對象，修改不會影響該對象返回對象的和組成的數組方法返回一個對象和鍵值對組成的數組方法判斷對象中屬性是否存在 Object.keys(obj) 返回對象的key組成的數組返回一個所有元素為字符串的數組，其元素來自于從給定的object上面可直接枚舉的屬性,不會返回原...

antz 2019-08-22 17:31 評論0 收藏0
個人常用JavaScript及React常用優化總結

摘要：插件性能優化及個人常用優化方法經常會觸發視覺變化。作用域鏈指的是當前作用于下可用變量的集合，它在各種主流瀏覽器中至少包含兩個部分局部變量的集合和全局變量的集合。在考慮優化時，數值和變量的性能差不多，并且速度顯著優于對象屬性和數組元素。 JavaScript 插件性能優化及個人react常用優化方法 JavaScript 經常會觸發視覺變化。有時是直接通過樣式操作，有時是會產生視覺變化...

yuanxin 2019-08-20 15:07 評論0 收藏0
常用JavaScript小技巧及原理詳解

摘要：使用一元加模擬函數原理對非數值類型的數據使用一元加，會起到與函數相同的效果。中，若判斷不為則不再進行下一步操作。使用邏輯或設置默認值邏輯或也屬于短路操作，即當第一個操作數可以決定結果時，不再對第二個操作數進行求值。善于利用JS中的小知識的利用，可以很簡潔的編寫代碼 1. 使用!!模擬Boolean()函數原理：邏輯非操作一個數據對象時，會先將數據對象轉換為布爾值，然后取反，兩個!!...

chnmagnus 2019-08-20 17:00 評論0 收藏0
[ ES6 ] 快速掌握常用 ES6 （二）

摘要：本系列文章適合快速掌握入門語法，想深入學習的小伙伴可以看看阮一峰老師的入門本篇文章是對之前文章的一個補充，可以使代碼更簡潔函數參數默認值在傳統語法中如果想設置函數默認值一般我們采用判斷的形式在新的語法中我們可以在參數聲明的同時賦予默認值參數本系列文章適合快速掌握 ES6 入門語法，想深入學習 ES6 的小伙伴可以看看阮一峰老師的《ECMAScript 6 入門》本篇文章是對之前文章...

hidogs 2019-08-23 14:07 評論0 收藏0