Detaillierte Erläuterung der JavaScript-Objekte und arrays_javascript-Fähigkeiten-js-Tutorial-php.cn

Viele höhere Programmiersprachen sind objektorientiert, wie z. B. C, C# und Java sowie andere höhere Programmiersprachen. Was sind also die Grundvoraussetzungen für eine objektorientierte Sprache? Lassen Sie uns nun über objektorientiertes Wissen sprechen.
Eine objektorientierte Sprache muss Entwicklern vier grundlegende Fähigkeiten bieten:

(1) Kapselung: die Fähigkeit, relevante Informationen (ob Daten oder Methoden) in einem Objekt zu speichern
(2) Aggregation: Die Fähigkeit, ein Objekt in einem anderen Objekt zu speichern
(3) Vererbung: Die Fähigkeit, die Attribute und Methoden einer Klasse von einer anderen Klasse (oder mehreren Klassen) zu erhalten
(4) Polymorphismus: Die Fähigkeit, Funktionen oder Methoden zu schreiben, die auf verschiedene Arten ausgeführt werden können

Da ECMAScript diese Anforderungen unterstützt, kann es als objektorientiert angesehen werden. In ECMAScript können Sie nicht auf die physische Darstellung eines Objekts zugreifen, sondern nur auf dessen Referenz. Jedes Mal, wenn ein Objekt erstellt wird, wird in der Variablen ein Verweis auf das Objekt gespeichert, nicht auf das Objekt selbst. Daher ist JavaScript eine schwach typisierte Web-Skriptsprache, die auf objektorientierter Basis basiert.
1. Objekttyp
Der Objekttyp enthält Eigenschaften (auch Felder genannt) und Methoden (auch Funktionen genannt). Daher gibt es wichtige Punkte, die beim Erstellen des Objekttyps erläutert werden müssen. Es gibt im Allgemeinen zwei Möglichkeiten, Objekttypnummern zu erstellen:
(1) Verwenden Sie den neuen Operator

var box=new Object(); 
box.name="张三";//创建属性以及初始化 
box.age=23; 
box.run=running();//创建方法 
function running(){ 
   return "我是中国人！"; 
} 
document.write(typeof box+"<br/>"); 
document.write(box.name+"<br/>"); 
document.write(box.age+"<br/>"); 
document.write(box.run);

Nach dem Login kopieren

Ausgabe: Objekt
Zhang San
23
Ich bin ein Chinese!
(2) Wörtliche Darstellung

var box={ 
 name:"张三", 
 age:23, 
 run:function(){  
   return "我是中国人！"; 
 } 
}; 
document.write(typeof box+"<br/>"); 
document.write(box.name+"<br/>"); 
document.write(box.age+"<br/>"); 
document.write(box.run());

Nach dem Login kopieren

Ausgabe: Wie oben
(3) Umfassende Nutzung
Wenn wir mehrere Parameter übergeben, müssen wir sie der Reihe nach eingeben. Um diesen umständlichen Prozess zu lösen, können wir mehrere Parameter kapseln
Verwenden Sie für einen Objekttyp den Objekttyp als Parameter. Wir können auch die nicht vorhandenen oder zusätzlichen Parameter beurteilen, was den Aufruf der Funktion
erleichtert Parameter zählen und übergeben.

function box(obj){ 
  if(obj.name!=undefined)document.write(obj.name+"<br/>"); 
  if(obj.age!=undefined)document.write(obj.age+"<br/>"); 
  if(obj.love!=undefined)document.write(obj.love+"<br/>"); 
} 
var obj={ 
  name:"张三", 
  age:23 
}; 
box(obj);

Nach dem Login kopieren

Ausgabe: Zhang San
23
2. Array-Typ
Arrays in ECMAScript unterscheiden sich stark von anderen Sprachen. Die Elemente in einem Array in JS können jeden Datentyp haben, und die Größe des Arrays ist ebenfalls
Es kann angepasst werden. Von der Seite her spiegelt es wider, dass JS eine schwach typisierte Sprache ist. Es gibt zwei Möglichkeiten, Zahlen vom Typ Array zu erstellen:
(1) Verwenden Sie den neuen Operator (neu kann weggelassen werden)

var box=new Array(1,2,3,4); 
document.write(typrof box+"<br/>");//Array属于Object类型 
document.write(box);//输出1,2,3,4

Nach dem Login kopieren

Indexindizes beginnen bei 0

var box=new Array(1,2,3,4); 
document.write(box[0]+box[1]+box[2]+box[3]);//输出1,2,3,4

Nach dem Login kopieren

Erstellen Sie ein Array mit zehn Elementen

var box=new Array(10);//创建数组默认必须是数字，必须是一位数字 
box[3]=4;//初始化数组中的元素 
box[5]=6; 
document.write(box);//输出,,,4,,6,,,,

Nach dem Login kopieren

(2) Verwenden Sie Literale, um Arrays zu erstellen

var box=[1,2,3,4]; 
document.write(typrof box+"<br/>");//输出Object 
document.write(box.length+"<br/>");//输出数组的长度为4 
document.write(box);//输出1,2,3,4

Nach dem Login kopieren

Erstellen Sie ein komplexes Array (kann unterschiedlicher Art sein)

var box=[ 
  { 
   name:"张三", 
   age:23 
  },//Object类型 
  [1,2,3,4],//Array类型 
  "JS",//String类型 
  25+25,//Number类型 
  new Array(1,2,3)//Array类型 
]; 
document.write(typeof box+"<br/>"); 
document.write(box[0].name+"<br/>"); 
document.write(box[3]);

Nach dem Login kopieren

Das Ausgabeergebnis der Seite ist:

3. Methoden in Objekten
(1)Konvertierungsmethode
Objekte oder Arrays verfügen über die Methoden toLocaleString(), toString() und valueOf(). Unter diesen geben toString() und valueOf()
zurück, unabhängig davon, wer überschrieben wird. den gleichen Wert zurückgeben. Das Array verkettet jeden Wert in Zeichenfolgenform, getrennt durch Kommas.

var box=[1,2,3,4]; 
document.write(box+"<br/>");//输出1,2,3,4 
document.write(box.toString()+"<br/>");//输出1,2,3,4 
document.write(box.valueOf()+"<br/>");//输出1,2,3,4 
document.write(box.toLocaleString());//输出1,2,3,4

Nach dem Login kopieren

Standardmäßig werden Array-Strings durch Kommas getrennt. Wenn Sie die Methode join() verwenden, können Sie zum Erstellen dieser Zeichenfolge
verschiedene Trennzeichen verwenden

var box=[1,2,3,4]; 
document.write(box+"<br/>"); 
document.write(typeof box+"<br/>"); 
document.write(box.join("-")+"<br/>"); 
document.write(typeof box.join("-"));

Nach dem Login kopieren

页面输出的结果为：

(2)栈方法
ECMAScript数组提供了一种让数组的行为类似于其他数据结构的方法。也就是说，可以让数组像栈一样，可以限
制插入和删除想的数据结构。栈是一种后进先出的数据结构，也就是最新添加的元素最早被移除。而栈元素的插入和
移除，只发生在栈的顶部。ECMAScript为数组专门提供了push()和pop()方法。
栈操作数组元素的图片：

push()方法可以接受任意数量的参数，把它们逐个添加到数组的末尾，并返回修改数组的长度。而pop()方法则从
数组末尾移除最后一个元素，减小数组的length值，然后返回移除的元素。

var box=[1,2,3,4]; 
document.write(box+"<br/>"); 
box.push(5,6);//在数组末尾添加元素 
document.write(box+"<br/>"); 
document.write(box.push(7,8)+"<br/>");//在数组末尾添加元素，并返回添加元素后数组的长度 
document.write(box+"<br/>"); 
box.pop();//移除数组末尾的元素 
document.write(box+"<br/>"); 
document.write(box.pop()+"<br/>");//移除数组末尾的元素，并返回移除的元素 
document.write(box);

Nach dem Login kopieren

输出：

(3)队列方法
栈方法是后进先出，队列方法是先进先出。队列在数组的末端添加元素，从数组的前端移除元素。通过push()向
数组末端添加一个元素，然后通过shift()方法从数组的前端移除一个元素。
队列操作数组元素的图片

var box=[1,2,3,4]; 
document.write(box+"<br/>"); 
box.push(5,6);//在数组末尾添加元素 
document.write(box+"<br/>"); 
document.write(box.push(7,8)+"<br/>");//在数组末尾添加元素，并返回添加元素后数组的长度 
document.write(box+"<br/>"); 
box.shift();//移除数组前端的一个元素 
document.write(box+"<br/>"); 
document.write(box.shift()+"<br/>");//移除数组前端的一个元素，并返回移除的元素 
document.write(box);

Nach dem Login kopieren

输出：

ECMAScript还为数组提供了一个unshift()方法，它和shift()方法的功能完全相反。unshift()方法为数组的前端添加
一个元素。

var box=[1,2,3,4]; 
document.write(box+"<br/>"); 
box.unshift(0);//在数组的前端添加一个元素 
document.write(box+"<br/>"); 
document.write(box.unshift(-1)+"<br/>");//在数组的前端添加一个元素，并返回添加元素会数组的长度 
document.write(box+"<br/>"); 
box.pop();//在数组末尾移除元素 
document.write(box+"<br/>"); 
document.write(box.pop()+"<br/>");//在数组末尾移除元素，并返回移除元素后数组的长度 
document.write(box);

Nach dem Login kopieren

输出：

(4)重排序方法
数组中已经存在两个直接用来排序的方法：reverse()和sort()。
reverse()：逆向排序

var box=[1,2,3,4,5]; 
box.reverse(); 
document.write(box+"<br/>");//输出54321 
document.write(box.reverse());//再次进行逆序，输出12345

Nach dem Login kopieren

sort():从小到大排序

var box=[3,2,6,4,1,5]; 
box.sort(); 
document.write(box+"<br/>");//输出1,2,3,4,5,6 
document.write(box.sort());//再次从小到大进行排序

Nach dem Login kopieren

如果我们实验次数多的话可能回遇到这样的问题，

var box=[0,15,10,1,5]; 
box.sort(); 
document.write(box);//输出0,1，10，15,5

Nach dem Login kopieren

我们从结果可以看出，这违背了我们想要的结果，解决方法：

function compare(value1,value2){ 
  if(value1<value2){ 
   return -1; 
  } 
  else if(value1>value2){ 
   return 1; 
  } 
  else{ 
   return 0;  
  }  
} 
var box=[0,15,10,1,5]; 
box.sort(compare); 
document.write(box);//输出0,1,5,10,15

Nach dem Login kopieren

(5)操作方法
JS为操作已经包含在数组中的元素提供了许多的方法。concat()方法可以基于当前数组创建一个新数组。slice()方
法可以基于当前数组获取指定区域元素并创建一个新数组。splice()方法主要用途是向数组的中部插入元素。
a

var box=[1,2,3,4,5]; 
var box1=box.concat(6);//创建新数组，并添加新元素 
document.write(box1+"<br/>");//输出1,2,3,4,5,6， 
document.write(box);//原数组不变化

Nach dem Login kopieren

var box=[1,2,3,4,5]; 
var box1=box.slice(2);//取出索引为2以后的元素组成新的数组 
document.write(box1+"<br/>");//输出3,4,5 
document.write(box);//原数组不变化

Nach dem Login kopieren

var box=[1,2,3,4,5]; 
var box1=box.slice(2,3);//取出索引为2到3之间的元素组成新的数组 
document.write(box1+"<br/>");//输出3 
document.write(box);//原数组不变化

Nach dem Login kopieren

splice中的删除功能

var box=[1,2,3,4,5]; 
var box1=box.splice(0,2);//截取索引为0开始的两个元素组成新的数组 
document.write(box1+"<br/>");//返回截取的元素1,2 
document.write(box);//当前数组被截取的元素被删除，输出3,4,5

Nach dem Login kopieren

splice中的插入功能

var box=[1,2,3,4,5]; 
var box1=box.splice(4,0,6);//索引为4的位置插入了一个元素 
document.write(box1+"<br/>");//返回新的数组为空，并没有截取元素 
document.write(box);//当前数组索引为4的位置插入一个元素1,2,3,4，6，5

Nach dem Login kopieren

splice中的替换功

var box=[1,2,3,4,5]; 
var box1=box.splice(4,1,6);//索引为4的元素被替换，替换下来的元素组成新数组 
document.write(box1+"<br/>");//返回新的数组5 
document.write(box);//被替换后的原数组1,2,3,4,6

Nach dem Login kopieren

以上就是关于JavaScript对象和数组的详细介绍，希望对大家的学习有所帮助。