JavaScript 고급 프로 그래 밍 - 요약 노트 - 1
4. 567917. 이 요약 노트 시 리 즈 는 제 가 최근 에 본 것 입 니 다
4. 567917. 안에 제 가 중요 하 다 고 생각 하고 적어 야 할 점, 저 에 게 도움 이 되 는 점 을 제 가 보 는 순서에 따라 열거 하 였 습 니 다
4. 567917. 요약 노트북 은 체계 성 이 없고 전면적 인 것 이 없다. 여기 서 일정한 기초 가 있 는 전단 개발 자 들 이 교 류 를 참고 하도록 한다
4. 567917. 안의 지식 점, 예 는 대부분 이 책 에서 기원 되 거나 연장 되 었 습 니 다. 모두 제 테스트 를 통 해 맞 았 지만 100% 정확 하 다 는 것 을 보장 할 수 없습니다. 만약 에 누군가가 잘못된 부분 을 보면 지적 해 주 셨 으 면 좋 겠 습 니 다. 감사합니다
본문:
1. 배열 검사 방법:
1. value instanceof Array // true / false
2. Array.isArray(value) // true / false, IE 9+,Firefox 4+, Safari 5+, Opera 10.5+, Chrome
2. 창고 와 대열
스 택 은 LIFO (Last - In - First - Out 후진 선 출) 의 데이터 구조 입 니 다.배열 에서 push () pop () 방법 으로 나타 나 는 대기 열 데이터 구조의 접근 규칙 은 FIFO (First - In - First - Out) 이 고 배열 에서 push () shift () 방법 으로 나타 납 니 다.
3. 배열 의 sort () 는 모든 항목 에 toString () 방법 을 호출 하기 때문에 문자열 에 따라 정렬 됩 니 다. 함 수 를 매개 변수 로 전송 하여 이 문 제 를 해결 할 수 있 습 니 다. 다음 과 같 습 니 다.
function compare (value1, value2) {
if (value1 < value2) {
return -1
} else if (value1 > value2) {
return 1
} else {
return 0
}
}
혹은
function compare (value1, value2) {
return value1 - value2
}
values.sort(compare)
어 릴 때 부터 큰 오름차 순 으로 배열 되 었 다.
4. 배열 의 slice () 방법 은 매개 변수 에 마이너스 가 있 으 면 배열 의 길이 에 해당 하 는 위 치 를 정 하고 끝 위치 가 시작 위치 보다 작 으 면 빈 배열 로 돌아 갑 니 다.
splice()
5. 배열 의 index Of () lastIndex Of () 방법 은 전체 방법 으로 항목 을 찾 고 찾 은 항목 의 색인 을 되 돌려 줍 니 다. 되 돌아 오지 않 으 면 - 1
// IE 9+,Firefox 2+, Safari 3+, Opera 9.5+, Chrome
6. 배열 의 교체 방법 에 대한 정리:
모든 방법 은 두 개의 인 자 를 받 아들 입 니 다. 1. 각 항목 에서 실행 되 는 함수, 2. 이 함 수 를 실행 하 는 역할 영역 대상 - this 에 영향 을 주 는 값 (선택 가능) 이 들 어 오 는 함 수 는 세 개의 인 자 를 받 습 니 다. 배열 항목 의 값, 색인, 이 배열.
1. every() // , true, true。
2. filter() // , true 。
3. forEach() // , 。
4. map() // , 。
5. some() // , true, true。
// IE 9+,Firefox 2+, Safari 3+, Opera 9.5+, Chrome
7. 병합 방법 reduce () reduceRight () / reduce () 는 머리 부터 옮 겨 다 니 고 reduceRight () 는 끝부분 부터 옮 겨 다 니 며 다른 것 은 모두 같 습 니 다.
/ / 이 두 가지 방법 은 모두 두 개의 인 자 를 받 아들 입 니 다. 하 나 는 모든 항목 에서 호출 된 함수 입 니 다. 하 나 는 병합 기반 의 초기 값 (선택 가능) 입 니 다. / / 들 어 오 는 함 수 는 네 개의 인 자 를 받 습 니 다. 앞의 값, 현재 값, 색인, 배열 대상 입 니 다. 이 함수 가 돌아 오 는 모든 값 은 첫 번 째 매개 변수 로 다음 항목 에 전 달 됩 니 다. / 주의: 두 번 째 인 자 를 전달 하면...즉, 병합 의 초기 값 입 니 다. 함 수 는 배열 의 첫 번 째 항목 부터 옮 겨 다 니 며, 전송 하지 않 으 면 첫 번 째 항목 을 초기 값 으로 두 번 째 항목 부터 옮 겨 다 닙 니 다.
8. 함수 에 대하 여
함 수 는 실제 대상 이기 때문에 모든 함 수 는 Function 형식의 인 스 턴 스 이 고 다른 인용 유형 과 마찬가지 로 속성 과 방법 을 가지 고 있 습 니 다.함수 가 대상 이기 때문에 함수 명 은 실제 적 으로 함수 대상 을 가리 키 는 지침 으로 특정한 함수 와 연결 되 지 않 습 니 다.
9. 함수 두 가지 정의 방식:
함수 성명 향상 에 차이 가 있 습 니 다.
a. 함수 설명:
function sum (n1, n2) {
return n1 + n2
}
b. 함수 식:
var sum = function (n1, n2) {
return n1 + n2
}
10. 함 수 는 매개 변수 로 다른 함수 에 전달 할 수 있 고 한 함수 에서 다른 함 수 를 되 돌려 줄 수 있 습 니 다. 예 를 들 어:
function createComparisonFunction (propertyName) {
return function (obj1, obj2) {
var value1 = obj1[propertyName]
var value2 = obj2[propertyName]
if (value1 < value2) {
return -1
} else if (value1 > value2) {
return 1
} else {
return 0
}
}
}
var data = [{
name: 'ZhangSan',
age: 18
}, {
name: 'Nicholas',
age: 19
}]
data.sort(createComparisonFunction('name'))
11. 함수 내부 속성
함수 내부 에 두 개의 특수 대상 이 있 습 니 다. arguments, this.arguments 는 callee 라 는 속성 이 있 습 니 다. 포인터 입 니 다. 이 arguments 대상 을 가 진 함 수 를 가리 키 며 다음 과 같이 사용 합 니 다. 단계 곱 하기:
function factorial (n) {
if (n <= 1) {
return 1
} else {
return n * arguments.callee(n - 1)
}
}
this 는 이 함 수 를 실행 하 는 환경 대상 es5 가 다른 함수 대상 의 속성 caller 를 규범화 시 켰 다 는 것 을 말 합 니 다. 이 속성 은 현재 함 수 를 호출 하 는 함수 의 인용 을 저장 하고 있 습 니 다. 전체 역할 영역 에 있 으 면 null 입 니 다. 예 를 들 어:
function outer () {
inner()
}
function inner () {
alert(inner.caller) // outer
}
또는:
function outer () {
inner()
}
function inner () {
alert(arguments.callee.caller) // outer
}
12. 함수 의 속성 과 방법
,length prototype。
length ,prototype
모든 함수 에는 계승 되 지 않 은 두 가지 방법 이 포함 되 어 있 습 니 다. call () 과 apply () 는 특정한 역할 영역 에서 함 수 를 호출 합 니 다. 실제 함수 내 this 포인터 의 값 apply () 를 설정 하여 두 개의 인 자 를 받 아들 이 는 것 과 같 습 니 다. 하 나 는 그 중에서 실행 되 는 역할 영역 입 니 다. 하 나 는 모든 인 자 를 포함 하 는 배열 입 니 다. Array 의 인 스 턴 스 일 수도 있 고 arguments 대상 call () 일 수도 있 습 니 다.첫 번 째 매개 변 수 는 apply () 와 같 습 니 다. 그 다음 에 모든 매개 변 수 를 함수 에 직접 전달 합 니 다. 예 를 들 어:
window.color = 'red'
var o = {
color: 'blue'
}
function sayColor () {
alert(this.color)
}
sayColor() // 'red'
sayColor.call(this) // 'red'
sayColor.call(window) // 'red'
sayColor.call(o) // 'blue'
es5 는 bind () 방법 을 정의 합 니 다. 이 방법 은 함수 의 인 스 턴 스 를 만 들 것 입 니 다. this 값 은 bind () 함수 에 전 달 된 값 으로 연 결 됩 니 다. 예 를 들 어:
window.color = 'red'
var o = {
color: 'blue'
}
function sayColor () {
alert(this.color)
}
var objSayColor = sayColor.bind(o)
objSayColor() // 'blue'
// IE 9+,Firefox 4+, Safari 5.1+, Opera 12+, Chrome
13. num. toString (n) / 이 방법 은 몇 진수 의 문자열 형식 을 되 돌려 줍 니 다. 예 를 들 어:
var num = 10
num.toString() // '10'
num.toString(10) // '10'
num.toString(2) // '1010'
num.toString(8) // '12'
num.toString(16) // 'a'
num.toFix(n) // , :
var num = 10
num.toFix(2) // '10.00'
// ,
num.toExponential(n) // ( e ) , :
var num2 = 10.1234
num2.toExponential(4) // '1.0123e+1'
14. String 형식의 모든 인 스 턴 스 는 length 속성 이 있 습 니 다. 두 바이트 문자 가 있어 도 모든 문 자 는 한 글자 만 계산 하고 길 이 를 계산 할 때 1 을 계산 합 니 다. 예 를 들 어:
var str = ' '
str.length // 2
15. 문자 방법: charAt () charCodeAt () / 이 두 가지 방법 은 모두 0 을 기반 으로 하 는 문자 위치 에 있 는 인 자 를 받 아들 이 고 전 자 는 해당 하 는 문 자 를 되 돌려 주 며 후 자 는 해당 하 는 문자 인 코딩 을 되 돌려 줍 니 다. 예 를 들 어:
var stringValue = 'hello world'
stringValue.charAt(1) // 'e'
stringValue.charCodeAt() // 101 //
// es5 , :
stringValue[1] // 'e'
// IE 8+,Firefox , Safari , Opera , Chrome
16. 문자열 조작 방법
str.concat() // + , , str
slice() substring() substr() // , , ,
// slice() substring() , ,substr() 。
// , , :
var stringValue = 'hello world!'
stringValue.slice(3) // 'lo world!'
stringValue.substring(3) // 'lo world!'
stringValue.substr(3) // 'lo world!'
stringValue.slice(3, 7) // 'lo wo'
stringValue.substring(3, 7) // 'lo wo'
stringValue.substr(3, 7) // 'lo worl'
// , :slice() ,substring() 0,
// substr() , 0
17. 문자열 위치 방법: index Of () lastIndex Of () / 이 두 가지 방법 은 모두 한 문자열 에서 주어진 하위 문자열 을 검색 한 다음 하위 문자열 의 위 치 를 되 돌려 줍 니 다 (찾 지 못 하면 되 돌려 줍 니 다 - 1)
/ / 이 두 가지 방법의 차 이 는 앞에서 뒤로 하위 문자열 을 검색 하고 뒤에서 하위 문자열 을 검색 하 는 것 입 니 다. 예 를 들 어:
var stringValue = 'hello world'
stringValue.indexOf('o') // 4
stringValue.lastIndexOf('o') // 7
/ / 이 두 가지 방법 은 두 번 째 인 자 를 받 아들 일 수 있 습 니 다. 문자열 의 어느 위치 에서 검색 을 시작 하 는 지 표시 합 니 다. 지정 한 위 치 를 포함 합 니 다. 예 를 들 어 다음 방법 은 순환 호출 을 통 해 일치 하 는 모든 하위 문자열 을 찾 을 수 있 습 니 다.
function getAllStr (str1, str2) {
var positions = []
var pos = str1.indexOf(str2)
while (pos > -1) {
positions.push(pos)
pos = str1.indexOf(str2, pos + 1)
}
return positions
}
18. trim () / / es5 는 이 방법 을 정의 합 니 다. 사전 및 접 두 사 를 삭제 한 모든 빈 칸 의 새 문자열 을 되 돌려 줍 니 다. 예 를 들 어:
var stringValue = ' abc '
stringValue.trim() // 'abc'
// IE 9+,Firefox 3.5+, Safari 5+, Opera 10.5+, Chrome
// Firefox 3.5+, Safari 5+ Chrome 8+ trimLeft() trimRight() ,
19. 문자열 대소 문자 변환 방법
toLowerCase() toLocaleLowerCase() toUpperCase() toLocaleUpperCase()
toLocaleLowerCase() toLocaleUpperCase() //
var stringValue = 'Hello World!'
stringValue.toLowerCase() // 'hello world!'
stringValue.toUpperCase() // 'HELLO WORLD!'
20. 문자열 의 패턴 일치 방법
이 부분 은 나중에 추가 할 까요?
21. URI 인 코딩 방법 encodeURI () encodeURIComponent () 대응 decodeURI () decodeURIComponent ()
인 코딩 방법 은 브 라 우 저 에 보 낼 수 있 도록 URI (Uniform Resource Identifiers 유 니 버 설 자원 식별 자) 를 인 코딩 할 수 있 습 니 다.유효한 URI 는 빈 칸 과 같은 일부 문 자 를 포함 할 수 없습니다.브 라 우 저가 받 아들 이 고 이해 할 수 있 도록 특수 한 UTF - 8 인 코딩 으로 모든 잘못된 문 자 를 대체 합 니 다.차이 점 은 encodeURI () 가 자체 URI 에 속 하 는 특수 문 자 를 인 코딩 하지 않 는 다 는 것 이다. 예 를 들 어 사칭, 정사 봉, 물음표, 우물 번호 등 이다.encodeURIComponent () 는 발 견 된 모든 비표 준 문 자 를 인 코딩 합 니 다.
decodeURI() encodeURI()
decodeURIComponent() encodeURIComponent()
제1 부 끝.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Thymeleaf 의 일반 양식 제출 과 AJAX 제출텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.