Vue mentakrifkan kaedah tatasusunan

Vue.js ialah rangka kerja JavaScript yang sangat popular, yang digunakan secara meluas dalam pembangunan aplikasi satu halaman, penulisan komponen, dsb. Dalam Vue.js, tatasusunan ialah struktur data yang biasa digunakan yang boleh membantu kami mengendalikan beberapa logik data yang kompleks. Di bawah, kami akan memperkenalkan kaedah tatasusunan yang biasa digunakan dalam Vue.js. Kaedah

1. push()

push() boleh menambah satu atau lebih elemen pada tatasusunan dan mengembalikan panjang tatasusunan baharu. Sebagai contoh, mentakrifkan tatasusunan dalam Vue.js:

data(){
  return {
    colors: ['red', 'green', 'blue']
  }
}

Kita boleh menggunakan kaedah push() untuk menambah elemen baharu pada tatasusunan:

methods: {
  addColor() {
    this.colors.push('yellow');
  }
}

Di sini kita mentakrifkan kaedah addColor() , Setiap kali kaedah ini dipanggil, elemen warna baharu ('kuning') ditambahkan pada tatasusunan.

2. pop()

Kaedah pop() boleh mengalih keluar elemen terakhir daripada tatasusunan. Sebagai contoh, mentakrifkan tatasusunan dalam Vue.js:

data() {
  return {
    fruits: ['apple', 'banana', 'orange']
  }
}

Kita boleh menggunakan kaedah pop() untuk mengalih keluar elemen terakhir dalam tatasusunan:

methods: {
  removeFruit() {
    this.fruits.pop();
  }
}

Di sini kita mentakrifkan kaedah removeFruit() , Setiap kali kaedah ini dipanggil, elemen terakhir dalam tatasusunan dialih keluar.

3. unshift()

Kaedah unshift() boleh menambah satu atau lebih elemen pada permulaan tatasusunan dan mengembalikan panjang tatasusunan baharu. Sebagai contoh, mentakrifkan tatasusunan dalam Vue.js:

data() {
  return {
    numbers: [3, 4, 5]
  }
}

Kita boleh menggunakan kaedah unshift() untuk menambah elemen baharu pada permulaan tatasusunan:

methods: {
  addNumber() {
    this.numbers.unshift(2);
  }
}

Di sini kita mentakrifkan addNumber () kaedah, setiap kali kaedah ini dipanggil, nombor baharu (2) ditambah pada permulaan tatasusunan.

4. shift()

Kaedah shift() boleh memadamkan elemen dari permulaan tatasusunan dan mengembalikan nilai elemen. Sebagai contoh, mentakrifkan tatasusunan dalam Vue.js:

data() {
  return {
    cars: ['BMW', 'Audi', 'Mercedes']
  }
}

Kita boleh menggunakan kaedah shift() untuk mengalih keluar elemen dari permulaan tatasusunan:

methods: {
  removeCar() {
    this.cars.shift();
  }
}

Di sini kita mentakrifkan removeCar( ) kaedah, Setiap kali kaedah ini dipanggil, elemen pertama ('BMW') dalam tatasusunan dipadamkan.

5. slice()

Kaedah slice() boleh mengembalikan tatasusunan baharu yang mengandungi elemen yang dipilih daripada tatasusunan asal. Sebagai contoh, mentakrifkan tatasusunan dalam Vue.js:

data() {
  return {
    animals: ['dog', 'cat', 'lion', 'tiger', 'monkey']
  }
}

Kita boleh menggunakan kaedah slice() untuk mengembalikan tatasusunan baharu bermula daripada elemen kedua (subskrip 1) tatasusunan asal dan berakhir dengan Elemen keempat (subskrip 3) tamat:

computed: {
  selectedAnimals() {
    return this.animals.slice(1, 4);
  }
}

Di sini kita mentakrifkan sifat dikira yang mengembalikan tatasusunan baharu yang mengandungi elemen yang dipilih daripada tatasusunan asal ('kucing', ' singa' dan 'harimau').

6. splice()

Kaedah splice() boleh menambah atau mengalih keluar satu atau lebih elemen pada tatasusunan. Sebagai contoh, mentakrifkan tatasusunan dalam Vue.js:

data() {
   return {
    cities: ['New York', 'London', 'Paris', 'Tokyo']
  }
}

Kita boleh menggunakan kaedah splice() untuk menambah elemen baharu pada tatasusunan:

methods: {
  addCity() {
    this.cities.splice(2, 0, 'Shanghai');
  }
}

Di sini kita mentakrifkan kaedah addCity() , Ia mula-mula menentukan bahawa operasi splice() bermula pada indeks 2, kemudian menggerakkan elemen yang tinggal ke belakang dan menambah elemen baharu ('Shanghai') pada indeks 2.

Pada masa yang sama, kami juga boleh menggunakan kaedah splice() untuk memadamkan elemen dalam tatasusunan:

methods: {
  removeCity() {
    this.cities.splice(1, 1);
  }
}

Di sini kami mentakrifkan kaedah removeCity() yang bermula dari subskrip 1 dan memadamkan elemen ('London').

Kesimpulan:

Di atas ialah kaedah tatasusunan yang biasa digunakan dalam Vue.js. Memahami kaedah ini boleh membantu kami menulis aplikasi Vue.js dengan lebih cekap. Sudah tentu, terdapat banyak kaedah tatasusunan lain, anda boleh menyemak sendiri dokumentasi apabila diperlukan.

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