Rumah > hujung hadapan web > tutorial js > Penjelasan terperinci tentang objek JavaScript dan kemahiran arrays_javascript

Penjelasan terperinci tentang objek JavaScript dan kemahiran arrays_javascript

WBOY
Lepaskan: 2016-05-16 15:27:50
asal
1150 orang telah melayarinya

Banyak bahasa pengaturcaraan peringkat tinggi berorientasikan objek, seperti C, C# dan Java serta bahasa pengaturcaraan peringkat tinggi yang lain Jadi apakah keperluan asas untuk bahasa berorientasikan objek? Sekarang mari kita bercakap tentang beberapa pengetahuan berorientasikan objek.
Bahasa berorientasikan objek perlu menyediakan pembangun dengan empat keupayaan asas:

  • (1) Enkapsulasi: keupayaan untuk menyimpan maklumat yang berkaitan (sama ada data atau kaedah) dalam objek
  • (2) Pengagregatan: Keupayaan untuk menyimpan satu objek dalam objek lain
  • (3) Warisan: Keupayaan untuk mendapatkan atribut dan kaedah kelas daripada kelas lain (atau berbilang kelas)
  • (4) Polimorfisme: Keupayaan untuk menulis fungsi atau kaedah yang boleh dijalankan dalam pelbagai cara

Memandangkan ECMAScript menyokong keperluan ini, ia boleh dianggap sebagai berorientasikan objek. Dalam ECMAScript, anda tidak boleh mengakses perwakilan fizikal objek, hanya rujukannya. Setiap kali objek dicipta, apa yang disimpan dalam pembolehubah adalah rujukan kepada objek, bukan objek itu sendiri. Oleh itu, JavaScript ialah bahasa skrip web yang ditaip lemah berdasarkan berorientasikan objek.
1. Jenis objek
Jenis Objek mengandungi sifat (juga dipanggil medan) dan kaedah (juga dipanggil fungsi). Oleh itu, terdapat perkara utama yang mesti dijelaskan semasa mencipta jenis Objek. Secara umumnya terdapat dua cara untuk mencipta nombor jenis Objek:
(1) Gunakan operator baharu

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); 
Salin selepas log masuk

Output: objek
           Zhang San
        23
Saya orang Cina!
(2) Perwakilan literal

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()); 
Salin selepas log masuk

Output: Sama seperti di atas
(3) Penggunaan komprehensif
Apabila kita melepasi berbilang parameter, kita perlu memasukkannya mengikut urutan Untuk menyelesaikan proses yang menyusahkan ini, kita boleh merangkum berbilang parameter
Untuk jenis Objek, gunakan jenis Objek sebagai parameter Kami juga boleh menilai parameter yang tidak wujud atau tambahan, yang menjadikannya lebih mudah untuk memanggil fungsi
. Kira dan lulus parameter.

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); 
Salin selepas log masuk

Output: Zhang San
        23
2. Jenis tatasusunan
Tatasusunan dalam ECMAScript sangat berbeza daripada bahasa lain Unsur-unsur dalam tatasusunan dalam JS boleh terdiri daripada sebarang jenis data dan saiz tatasusunan juga adalah
. Ia boleh diselaraskan. Ia mencerminkan dari sisi bahawa JS adalah bahasa yang ditaip lemah. Terdapat dua cara untuk mencipta nombor jenis Tatasusunan:
(1) Gunakan operator baharu (baru boleh ditinggalkan)

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

Subskrip indeks bermula dari 0

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

Buat tatasusunan dengan sepuluh elemen

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

(2) Gunakan literal untuk mencipta tatasusunan

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 
Salin selepas log masuk

Buat tatasusunan kompleks (boleh pelbagai jenis)

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]); 
Salin selepas log masuk

Hasil keluaran halaman ialah:

3. Kaedah dalam objek
(1)Kaedah penukaran
Objek atau tatasusunan mempunyai kaedah toLocaleString(), toString() dan valueOf(). Antaranya, toString() dan valueOf() akan mengembalikan
tidak kira siapa yang ditindih. mengembalikan nilai yang sama. Tatasusunan menggabungkan setiap nilai dalam bentuk rentetan, dipisahkan dengan koma.

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 
Salin selepas log masuk

Secara lalai, rentetan tatasusunan dipisahkan dengan koma. Jika anda menggunakan kaedah join(), anda boleh menggunakan pembatas yang berbeza untuk membina rentetan ini

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("-")); 
Salin selepas log masuk

页面输出的结果为:

(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); 
Salin selepas log masuk

输出:

(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); 
Salin selepas log masuk

输出:

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); 
Salin selepas log masuk

输出:

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

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

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());//再次从小到大进行排序 
Salin selepas log masuk

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

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

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

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 
Salin selepas log masuk

(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);//原数组不变化 
Salin selepas log masuk

b

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

c

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

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 
Salin selepas log masuk

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 
Salin selepas log masuk

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 
Salin selepas log masuk

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

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan