Maison > Article > interface Web > Introduction à l'utilisation du tableau d'encapsulation secondaire js (code)
Introduction à l'utilisation du tableau d'encapsulation secondaire js (code)
- 不言original
- 2018-07-25 10:01:501353parcourir
Le contenu partagé avec vous dans cet article concerne l'encapsulation secondaire de nos tableaux par la structure de données JS. Le contenu est très détaillé. Ensuite, jetons un coup d'œil au contenu spécifique, j'espère que cela pourra aider tout le monde.
1. Créez une nouvelle classe myArray
class myArray {
}
2. Initialisez le constructeur sur cette classe
/**
* 初始化构造函数
* @param capacity 容量
*/
constructor(capacity) {
// 初始化arr变量
this.arr = capacity === undefined ? [] : new Array(capacity);
// 数组长度
this.length = 0;
// 数组容量
this.capacity = capacity;
}
3. >
4. Ajout de méthodes pour ajouter des éléments au tableau// 获取数组的长度
getLength() {
return this.length;
}
// 获取数组的容量
getCapacity() {
return this.arr.length;
}
// 判断数组是否为空
isEmpty() {
return this.length === 0;
}
5. Ajout de méthodes pour supprimer des éléments du tableau/**
* 在数组中在index插入一个新的元素e
* @param index 索引
* @param e 元素
* 原理：
* 首先在传进来index索引的位置向后面移动一位，
* 然后把该index索引腾空出来放进传入的新的元素e，
* 最后维护一下length，长度加1
*/
add(index, e) {
if (this.length === this.arr.length) {
throw new Error('Add failed. Array is full.')
}
if (index < 0 || index > this.length) {
throw new Error('Add failed. Request index >= 0 and index <= length');
}
for (let i = this.length - 1; i >= index; i--) {
this.arr[i + 1] = this.arr[i];
}
this.arr[index] = e;
this.length++;
}
// 向数组首位添加一个新元素e
addFirst(e) {
this.add(0, e)
}
// 向数组所有的元素后面添加一个新元素e
addLast(e) {
this.add(this.length, e);
}
6. éléments du tableau/**
* 从数组中删除index位置的元素，返回删除的元素
* @param index
* @returns {*}
* 原理：
* 首先找到索引index的位置，
* 然后把索引后面的元素都向前移动一位，其实是把索引后面的翻盖前面一位的元素
* 最后维护一下length，减一
*
*/
remove(index) {
if (index < 0 || index >= this.length) {
throw new Error('Remove failed. Request index >= 0 and index <= length');
}
let ret = this.arr[index];
for (let i = index + 1; i < this.length; i++) {
this.arr[i - 1] = this.arr[i];
}
this.length--;
return ret;
}
// 从数组中删除第一个元素，返回删除的元素
removeFirst() {
return this.remove(0)
}
// 从数组中删除最好个元素，返回删除的元素
removeLast() {
return this.remove(this.length - 1)
}
// 从数组中删除元素e
removeElement(e) {
let index = this.findIndex(e);
if (index != -1) {
this.remove(index);
}
}
7. Ajouter la méthode de recherche incluse dans le tableau // 获取index索引位置的元素
get(index) {
if (index < 0 || index >= this.length) {
throw new Error('Get failed. Index is illegal.');
}
return this.arr[index];
}
// 修改index索引的元素e
set(index, e) {
if (index < 0 || index >= this.length) {
throw new Error('Get failed. Index is illegal.');
}
this.arr[index] = e;
}
8. La méthode pour tester le tableau encapsulé // 查询数组是否包含e元素
contains(e) {
for (let i = 0; i < this.length; i++) {
if (this.arr[i] === e) {
return true;
}
}
return false;
}
// 查找数组中元素所在的所在的索引，如果不存在e，则返回-1
findIndex(e) {
for (let i = 0; i < this.length; i++) {
if (this.arr[i] === e) {
return i;
}
}
return -1;
}
// 把数组转换为字符串，并返回结果
toString() {
let res = "";
console.log(`Array: length = ${this.length}, capacity = ${this.capacity}.`);
res += "[";
for (let i = 0; i < this.length; i++) {
res += this.arr[i];
if (i !== this.length - 1) {
res += ', '
}
}
res += "]";
return res.toString();
}
9. Description de la méthode// 使用我们的类数组，声明一个容量为20的数组
let arr = new myArray(20);
// 首位增加数据
arr.addFirst('波波');
console.log(arr.toString());
// 输出：Array: length = 1, capacity = 20.
// 输出：[波波]
for (let i = 0; i < 10; i++) {
arr.addLast(i)
}
console.log(arr.toString());
// 输出：Array: length = 11, capacity = 20.
// 输出：[波波, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
console.log(arr.findIndex(4)); // 5
// ...
10. Code complet du tableau encapsulé secondaire| 方法 | 描述 | 参数 | 参数说明 | 示例 |
|---|---|---|---|---|
| getLength | 返回数组的长度 | getLength() | ||
| getCapacity | 返回数组的容量 | getCapacity() | ||
| isEmpty | 判断数组是否为空，返回布尔值 | isEmpty() | ||
| addFirst | 向数组首位添加一个新元素 | e | 新元素 | addFirst(e) |
| addLast | 向数组所有的元素后面添加一个新元素 | e | 新元素 | addLast(e) |
| add | 在数组中在index插入一个新的元素e | index, e | index索引，e 新元素 | add(index, e) |
| remove | 从数组中删除index位置的元素，返回删除的元素 | index | 索引 | remove(index) |
| removeFirst | 从数组中删除第一个元素，返回删除的元素 | removeFirst() | ||
| removeLast | 从数组中删除最后的元素，返回删除的元素 | removeLast() | ||
| removeElement | 从数组中删除元素e | e | 删除的元素e | removeElement(e) |
| get | 获取index索引位置的元素 | index | 索引 | get(index) |
| set | 修改index索引的元素e | index, e | index 索引，e新替换的元素 | set(index, e) |
| contains | 查询数组是否包含e元素 | e | 查询包含的元素 | contains(e) |
| findIndex | 查找数组中e元素所在的所在的索引，如果不存在e，则返回-1 | e | 查询的元素 | findIndex(e) |
| toString | 返回数组格式化数据 | toString() |
class myArray {
/**
* 初始化构造函数
* @param capacity 容量
*/
constructor(capacity) {
// 初始化arr变量
this.arr = capacity === undefined ? [] : new Array(capacity);
// 数组长度
this.length = 0;
// 数组容量
this.capacity = capacity;
}
// 获取数组的长度
getLength() {
return this.length;
}
// 获取数组的容量
getCapacity() {
return this.arr.length;
}
// 判断数组是否为空
isEmpty() {
return this.length === 0;
}
addFirst(e) {
this.add(0, e)
}
// 向所有的元素后面添加一个新元素
addLast(e) {
this.add(this.length, e);
}
/**
* 在数组中在index插入一个新的元素e
* @param index 索引
* @param e 元素
* 原理：首先在传进来index索引的位置向后面移动一位，
* 然后把该index索引腾空出来放进传入的新的元素e，
* 最后维护一下length，长度加1
*/
add(index, e) {
if (this.length === this.arr.length) {
throw new Error('Add failed. Array is full.')
}
if (index < 0 || index > this.length) {
throw new Error('Add failed. Request index >= 0 and index <= length');
}
for (let i = this.length - 1; i >= index; i--) {
this.arr[i + 1] = this.arr[i];
}
this.arr[index] = e;
this.length++;
}
/**
* 从数组中删除index位置的元素，返回删除的元素
* @param index
* @returns {*}
* 原理：
* 首先找到索引index的位置，
* 然后把索引后面的元素都向前移动一位，其实是把索引后面的翻盖前面一位的元素
* 最后维护一下length，减一
*
*/
remove(index) {
if (index < 0 || index >= this.length) {
throw new Error('Remove failed. Request index >= 0 and index <= length');
}
let ret = this.arr[index];
for (let i = index + 1; i < this.length; i++) {
this.arr[i - 1] = this.arr[i];
}
this.length--;
return ret;
}
// 从数组中删除第一个元素，返回删除的元素
removeFirst() {
return this.remove(0)
}
// 从数组中删除最好个元素，返回删除的元素
removeLast() {
return this.remove(this.length - 1)
}
// 从数组中删除元素e
removeElement(e) {
let index = this.findIndex(e);
if (index != -1) {
this.remove(index);
}
}
// 获取index索引位置的元素
get(index) {
if (index < 0 || index >= this.length) {
throw new Error('Get failed. Index is illegal.');
}
return this.arr[index];
}
// 修改index索引的元素e
set(index, e) {
if (index < 0 || index >= this.length) {
throw new Error('Get failed. Index is illegal.');
}
this.arr[index] = e;
}
// 查询数组是否包含e元素
contains(e) {
for (let i = 0; i < this.length; i++) {
if (this.arr[i] === e) {
return true;
}
}
return false;
}
// 查找数组中元素所在的所在的索引，如果不存在e，则返回-1
findIndex(e) {
for (let i = 0; i < this.length; i++) {
if (this.arr[i] === e) {
return i;
}
}
return -1;
}
// 把数组转换为字符串，并返回结果
toString() {
let res = "";
console.log(`Array: length = ${this.length}, capacity = ${this.capacity}.`);
res += "[";
for (let i = 0; i < this.length; i++) {
res += this.arr[i];
if (i !== this.length - 1) {
res += ', '
}
}
res += "]";
return res.toString();
}
}
// 测试
// 使用我们的类数组，声明一个容量为20的数组
let arr = new myArray(20);
// 首位增加数据
arr.addFirst('波波');
console.log(arr.toString());
// 输出：Array: length = 1, capacity = 20.
// 输出：[波波]
for (let i = 0; i < 10; i++) {
arr.addLast(i)
}
console.log(arr.toString());
// 输出：Array: length = 11, capacity = 20.
// 输出：[波波, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
console.log(arr.findIndex(4)); // 5
// ...上面的方法都可以测试使用。
Analyse modulaire JS (espace de noms)Qu'est-ce qu'un objet variable JS ? Explication détaillée des objets variables JS et précautions
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Bilan js 2018 : les raisons fondamentales de l'existence du framework sont les suivantesArticle suivant：Bilan js 2018 : les raisons fondamentales de l'existence du framework sont les suivantes
Articles Liés
Voir plus- Une analyse approfondie du composant de groupe de liste Bootstrap
- Explication détaillée du currying de la fonction JavaScript
- Exemple complet de génération de mot de passe JS et de détection de force (avec téléchargement du code source de démonstration)
- Angularjs intègre l'interface utilisateur WeChat (weui)
- Comment basculer rapidement entre le chinois traditionnel et le chinois simplifié avec JavaScript et l'astuce permettant aux sites Web de prendre en charge le basculement entre les compétences en chinois simplifié et traditionnel_javascript