> 웹 프론트엔드 > JS 튜토리얼 > 객체 및 배열의 ​​심층적인 JavaScript 고급 프로그래밍(스택 방법, 대기열 방법, 재정렬 방법, 반복 방법)_javascript 기술

객체 및 배열의 ​​심층적인 JavaScript 고급 프로그래밍(스택 방법, 대기열 방법, 재정렬 방법, 반복 방법)_javascript 기술

WBOY
풀어 주다: 2016-05-16 15:28:31
원래의
1220명이 탐색했습니다.

상속은 OO 언어에서 가장 많이 언급되는 개념 중 하나입니다. 많은 OO 언어는 인터페이스 상속과 구현 상속이라는 두 가지 유형의 상속을 지원합니다. 인터페이스 상속은 메서드 시그니처만 상속하는 반면, 구현 상속은 실제 메서드를 상속합니다. 언급한 대로 ECMAScript에서는 함수에 서명이 없기 때문에 인터페이스 상속이 불가능합니다. ECMAScript는 구현 상속만 지원하며 구현 상속은 주로 프로토타입 체인에 의존합니다.

1. 객체 리터럴을 사용하여 객체 정의

var person={};
로그인 후 복사

이런 방식으로 객체를 생성하면 실제로 Object 생성자가 호출되지 않습니다.

개발자는 객체 리터럴 구문을 선호합니다.

2. 때로는 많은 수의 선택적 매개변수를 전달해야 하는 경우 일반적으로 객체 리터럴을 사용하여 여러 선택적 매개변수를 캡슐화합니다.

3. 객체 속성의 점 표기와 대괄호 표기의 차이점

(1) 기능적으로는 둘 사이에 차이가 없습니다

(2) 하지만 대괄호의 장점은 변수를 통해 속성에 액세스할 수 있다는 것입니다.

예:

  var person={
  name:"Nic"
}
로그인 후 복사

점 표기: 사람.이름

대괄호 표기: var prop="name";
사람[소품]

(3) 또 다른 장점은 다음과 같습니다.

속성 이름에 문법 오류나 예약어를 유발할 수 있는 문자나 키워드가 포함된 경우 대괄호를 사용해도 문제가 되지 않습니다

예: 사람["이름"]="확인";

(4) 일반적으로 점 표기법을 사용하는 것이 좋습니다

4. 배열 생성 문제

var colors=[1,2,] //이 작업을 수행하지 마세요. 이렇게 하면 2~3개의 항목으로 구성된 배열이 생성됩니다.
var opy=[,,,,,] //이 작업을 수행하지 마세요. 이렇게 하면 5~6개 항목의 배열이 생성됩니다.

IE8 및 이전 버전에서는 배열 리터럴 구현에 버그가 있기 때문입니다

리터럴을 사용하여 배열을 생성할 때 배열 생성자가 호출되지 않습니다

5. 특정 값을 설정한 인덱스가 배열의 기존 항목 수를 초과하는 경우.

예: var color=[1,2,3]

color[3], 배열은 인덱스 값에 1을 더한 길이만큼 자동으로 늘어납니다

이때 color[3] 값은 정의되지 않았습니다

6. 배열의 길이는 읽기 전용이 아닙니다. 길이 속성을 설정하면 배열 끝에 새 항목을 계속해서 추가할 수 있습니다.

7. 배열을 문자열로 변환 toString() Join()

array.toString()  //返回以逗号分隔的字符串
array.valueOf()  //返回的还是数组
array.join(",")  //也可以
로그인 후 복사

8. 배열 스택 메소드 push() pop()

스택은 데이터 구조입니다. 즉, 가장 최근에 추가된 항목이 가장 먼저 제거됩니다(후입선출). 스택의 항목 삽입 및 제거는 스택의 상단 한 위치에서만 발생합니다.
ECMAScript는 이러한 종류의 스택을 구현하기 위해 push() 및 pop() 메서드를 제공합니다.

push() 메서드는 배열 끝에 하나 이상의 요소를 추가하고 새 길이를 반환합니다.

pop() 메서드는 배열의 마지막 요소를 제거하고 반환하는 데 사용됩니다.

예:

var arr=[];
var count=arr.push('a','b');  //count=2
arr.push('c');
var item=arr.pop();  //移除最后一项 c item=c 并且改变数组长度
로그인 후 복사

9. 큐 메소드 Shift() unshift()

큐 데이터에 대한 액세스 규칙은 선입선출입니다
ECMAScript는 이를 구현하기 위해 Shift()를 제공합니다.
Shift() 메서드는 배열에서 첫 번째 요소를 제거하고 첫 번째 요소의 값을 반환하는 데 사용됩니다.
unshift() 메서드는 배열의 시작 부분에 하나 이상의 요소를 추가하고 새 길이를 반환합니다.

10. 재정렬 방법 sort() reverse()

ECMAScript는 구현을 위해 sort() 및 reverse()를 제공합니다.

sort()는 각 배열 항목의 tostring() 메서드를 호출하고 결과 문자열을 비교하여 정렬합니다.

11. 배열 연결 concat()

concat() 메서드는 두 개 이상의 배열을 연결하는 데 사용됩니다.

이 메서드는 기존 배열을 변경하지 않고 연결된 배열의 복사본만 반환합니다.

12. Slice() 메서드는 기존 배열에서 선택한 요소를 반환합니다.

13. 위치 메서드: indexOf() 및 lastIndexOf()

14. 반복 방법

ECMAScript5는 배열 항목 값, 배열 내 항목 위치, 배열 쌍 자체      라는 세 가지 매개변수를 받는 다음과 같은 5가지 메소드를 정의합니다.

every(),filter(),forEach(),map(),some()
로그인 후 복사

예:

var num=[1,2,3,4];
var res=num.every(function(item,index,array){
  return (item>2)
})  //false  必须每一项都大于2,才返回true
var res=num.some(function(item,index,array){
  return (item>2)
})  //true 只要有一个大于2,就返回true
var res=num.filter(function(item,index,array){
  return (item>2)
})  //[3,4]   
var res=num.forEach(function(item,index,array){
  return (item>2)
})  //[1,4,9,16]  
로그인 후 복사

자바스크립트 배열 객체의 반복 메서드

/* javascript 数组对象中的迭代方法 
 * ECMAScript5为数组定义了5个迭代方法。每个方法都接受两个参数,第一个是进行迭代的函数,第二个是该函数的作用域对象【可选】。 


 * 进行迭代的函数接受三个参数,第一个是数组中要进行迭代的元素的值,第二个是数组候总要进行迭代的元素的位置,第三个是迭代数组本身。 


* 1. every()  对数组中的每一项运行给定的函数,如果该函数对每一项都返回true,则返回true 
 * 2. filter() 对数组中的每一项运行给定的函数,返回该函数返回true的项组成的数组。 
 * 3. forEach() 对数组中的每一项运行给定的函数,这个方法没有返回值 
 * 4. map()   对数组中的每一项运行给定的函数,返回每次函数调用的结果组成的数组 
 * 5. some()  对数组中的每一项运行给定的函数,如果该函数对任意一项返回true,则返回true 
 * 
 * 这些迭代方法支持的浏览器有,IE9+,Firefox2+,Safari3+,Opera 9.5+,chrome 
 */ 
var num = [1,2,3,4,5,6,7,8,9]; 
var everyResult = num.every(function(item, index, array) { 
  if(item > 2) { 
    return true; 
  } 
}); 
alert(everyResult); 
var someResult = num.some(function(item) { 
  if(item > 2) { 
    return true; 
  } 
}); 
alert(someResult); 
var filterResult = num.filter(function(item) { 
  if(item > 2) { 
    return true; 
  } 
}); 
alert(filterResult); 
var mapResult = num.map(function(item) { 
  if(item > 2) { 
    return true; 
  } 
}); 
alert(mapResult); 
var forEachResult = num.forEach(function(item) { 
  if(item > 2) { 
    return true; 
  } 
}); 
alert(forEachResult); 
로그인 후 복사
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿