> 웹 프론트엔드 > JS 튜토리얼 > js 보조 캡슐화 배열 사용 소개(코드)

js 보조 캡슐화 배열 사용 소개(코드)

不言
풀어 주다: 2018-07-25 10:01:50
원래의
1394명이 탐색했습니다.

이 기사에서 공유한 내용은 JS 데이터 구조에 의한 배열의 2차 캡슐화에 관한 것입니다. 다음으로 구체적인 내용을 살펴보겠습니다.

1. 새로운 myArray 클래스를 생성합니다

class myArray {
    
}
로그인 후 복사

3. 배열 멤버 메서드를 추가합니다

/**
 * 初始化构造函数
 * @param capacity 容量
 */
constructor(capacity) {
    // 初始化arr变量
    this.arr = capacity === undefined ? [] : new Array(capacity);
    // 数组长度
    this.length = 0;
    // 数组容量
    this.capacity = capacity;
}
로그인 후 복사

4. 요소를 추가하고 제거합니다. 배열에서 메서드

// 获取数组的长度
getLength() {
    return this.length;
}

// 获取数组的容量
getCapacity() {
    return this.arr.length;
}

// 判断数组是否为空
isEmpty() {
    return this.length === 0;
}
로그인 후 복사

6. 쿼리 요소를 추가하고 배열의 요소를 수정하는 방법

/**
 * 在数组中在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&#39;);
    }

    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);
}
로그인 후 복사

7. 배열에 포함된 검색 메서드 추가

/**
 * 从数组中删除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);
    }
}
로그인 후 복사

8. 캡슐화된 배열을 테스트하는 방법

// 获取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;
}
로그인 후 복사

9. 메서드 설명

메소드 DescriptiongetLength배열의 길이를 반환합니다getLength()배열의 용량을 반환합니다getCapacity() 배열이 비어 있는지 확인하고 부울 값을 반환합니다isEmpty()배열의 첫 번째 요소에 새 요소 추가 배열의 모든 요소 뒤에 새 요소 추가 배열의 인덱스에 새 요소 삽입 e배열에서 인덱스 위치의 요소를 제거하고 삭제를 반환합니다. 요소 배열에서 첫 번째 요소를 제거하고 삭제된 요소를 반환합니다.removeFirst()배열에서 마지막 요소를 제거하고 삭제된 요소를 반환removeLast()요소 e 제거 배열에서인덱스 인덱스 위치에서 요소 가져오기 인덱스 요소 수정 index e배열에 e 요소가 포함되어 있는지 쿼리Find e가 존재하지 않으면 -1이 반환됩니다. toString()
// 查询数组是否包含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();
}
로그인 후 복사
JS 모듈 분석(네임스페이스) JS 변수 개체란 무엇인가요? JS 변수 객체에 대한 자세한 설명 및 주의사항
Parameters 매개변수 설명 Example


getCapacity


isEmpty


addFirst
e 새 요소 addFirst(e) addLast
e 새 요소 addLast(e) add
index, e index index, e 새 요소 add(index, e) remove
index index remove(index) removeFirst


removeLast


removeElement
e 제거된 요소 e removeElement (e) get
index index get(index) set
index, e index index, e의 새로 대체된 요소 set(index, e) contains
e Query 포함된 요소 contains(e) findIndex
10. 완전한 보조 캡슐화된 배열 코드 관련 권장 사항:

위 내용은 js 보조 캡슐화 배열 사용 소개(코드)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿