Rumah  >  Artikel  >  hujung hadapan web  >  kaedah lanjutan jquery

kaedah lanjutan jquery

王林
王林asal
2023-05-09 11:06:37634semak imbas

jQuery ialah perpustakaan JavaScript terkenal yang mengandungi banyak fungsi berkuasa, salah satunya adalah fungsi yang sangat penting ialah kaedah lanjutan. Kaedah ini membolehkan menggabungkan kandungan satu atau lebih objek ke dalam objek baharu. Sintaks kaedah

extend adalah seperti berikut:

$.extend(target, [object1 [, object2 [, ... ]]])

Antaranya, sasaran mewakili objek sasaran, iaitu hasil penggabungan semua objek lain akan digabungkan ke dalam objek ini. object1, object2, dsb. ialah objek yang akan digabungkan. Pelbagai objek boleh digabungkan. Kaedah lanjutan juga boleh dipanggil dengan menghantar satu atau lebih argumen dengan hanya satu objek.

Seterusnya, mari kita fahami kaedah lanjutan melalui contoh mudah.

var first = {name: 'John', age: 30};
var second = {name: 'Jane', address: 'New York'};

$.extend(first, second);

console.log(first);

Dalam contoh ini, kami mencipta objek bernama pertama dan objek bernama kedua. Kemudian kami memanggil kaedah lanjutan dan menggabungkan kandungan objek kedua ke dalam objek pertama.

Hasil keluaran ialah:

{name: "Jane", age: 30, address: "New York"}

Kita dapat melihat bahawa objek hasil merangkumi semua atribut objek pertama dan kedua.

Selain bergabung menjadi objek baharu, kami juga boleh menambah sifat daripada berbilang objek kepada objek sedia ada. Dalam kes ini, parameter pertama akan diluluskan sebagai objek sasaran, dan objek lain akan digabungkan ke dalam sifatnya. Objek sasaran ini boleh menjadi objek kosong, yang akan kekal kosong, tetapi objek lain akan digabungkan ke dalam sifatnya. Berikut ialah contoh:

var first = {name: 'John', age: 30};
var second = {name: 'Jane', address: 'New York'};
var third = {gender: 'Male'};

$.extend(first, second, third);

console.log(first);

Outputnya ialah:

{name: "Jane", age: 30, address: "New York", gender: "Male"}

Sekarang objek pertama mengandungi semua sifat objek kedua dan ketiga.

Selain kegunaan asas ini, kaedah lanjutan mempunyai banyak kegunaan yang berbeza. Sebagai contoh, kita boleh menggunakannya untuk menggabungkan objek yang berbeza dan mencipta kelas dengan cara yang lebih fleksibel. Mari lihat contoh mencipta kelas menggunakan pendekatan ini.

function Person(name, age) {
    this.name = name;
    this.age = age;
}

Person.prototype.getAddress = function() {
    return 'New York';
};

var Employee = function(employeeId) {
    this.employeeId = employeeId;
}

Employee.prototype.getEmployeeId = function() {
    return this.employeeId;
}

var PersonEmployee = $.extend({}, Person.prototype, Employee.prototype);

var person = new Person('John', 30);
var employee = new Employee(12345);

console.log(PersonEmployee);
console.log(person.getAddress());
console.log(employee.getEmployeeId());

Dalam contoh ini, kami telah menentukan kelas bernama Person dan kelas bernama Employee. Kelas Orang mengandungi sifat nama dan umur, serta kaedah getAddress. Kelas Employee mengandungi sifat employeeId dan kaedah getEmployeeId. Kami kemudian mencipta objek baharu, menggabungkan prototaip Orang dan Pekerja ke dalamnya, dan memanggilnya kelas PersonEmployee.

Akhir sekali, kami mencipta tika Person dan tika Pekerja dan memanggil kaedah getAddress dan kaedah getEmployeeId menggunakan kelas PersonEmloyee baharu. Ini akan membolehkan kami mengekalkan semua sifat dan kaedah di satu tempat tanpa perlu mengulangi prosedur kami sendiri.

Ringkasnya, kaedah lanjutan jQuery ialah kaedah yang sangat berguna yang membolehkan kami mengendalikan dan mengurus objek yang berbeza dengan lebih mudah. Sama ada anda mencipta objek baharu atau menggabungkan berbilang objek menjadi satu, kaedah lanjutan ialah pilihan yang baik. Ia mungkin bukan pendekatan yang paling elegan, tetapi ia selalunya berguna apabila bekerja dengan program JavaScript yang kompleks.

Atas ialah kandungan terperinci kaedah lanjutan jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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
Artikel sebelumnya:css set saiz jadualArtikel seterusnya:css set saiz jadual