> 웹 프론트엔드 > JS 튜토리얼 > es6의 다양한 데이터 유형의 확장된 예에 대한 자세한 설명

es6의 다양한 데이터 유형의 확장된 예에 대한 자세한 설명

零下一度
풀어 주다: 2017-06-26 10:24:42
원래의
1813명이 탐색했습니다.

1. 문자열 확장

  1. for...of

  2. includes, startWith, endWith로 탐색할 수 있는 문자열에 Iterator를 추가하면 모두 부울 값을 반환하고 두 번째 매개변수(검색 시작 위치)를 지원합니다. ), endWith는 처음 n자에 대한 것이고, 나머지 두 개는 n번째부터 끝까지입니다.

  3. repeat는 새 문자열을 반환하고, 매개변수는 반복 횟수입니다(소수점은 내림, 음수 또는 Infnity는 보고합니다). 오류, 0 ~ -1은 0과 동일하며 문자열은 숫자로 변환됩니다.)

  4. padStart, padEnd는 머리 또는 꼬리에서 완료됩니다. 첫 번째 매개변수는 문자열의 최소 길이이고 두 번째 매개변수는 매개변수는 문자열

  5. 템플릿 문자열 `${...}`

2. 숫자 값의 확장

  1. Number.isFinite는 값이 유한한지 확인하고 값이 유한하지 않은 경우 false를 반환합니다. -숫자 값 ​​

  2. Number.isNaN은 값이 NaN인지 확인합니다. NaN만 true를 반환합니다.
    전통적인 메서드 isFinite isNaN은 먼저 숫자가 아닌 값을 숫자 값으로 변환하기 위해 Number()를 호출합니다

  3. Number.parseInt(), Number.parseFloat() 기존 방법과 마찬가지로 전역 메서드 및 언어 모듈화

  4. Number.isInteger()가 정수인지

  5. Number인지 확인하는 것이 목적입니다. EPSILON은 매우 작은 상수입니다. 부동 소수점 계산의 오류는 이 값보다 작습니다. ok

  6. JS의 정확한 정수 범위: -2^53~2^53(양 끝 제외),
    Number.MAX_SAFE_INTEGER = Math. pow(2, 53) - 1;
    Number.MIN_SAFE_INTEGER = -Number.MAX_SAFE_INTEGER;
    Number.isSafeInteger()는 정수가 이 범위에 속하는지 확인하는 데 사용됩니다.

  7. Math.trunc()는 소수 부분을 제거합니다.
    Math.sign()은 음의 정수인지 0인지 결정합니다.
    Math.cbrt()는 숫자의 세제곱근을 계산합니다. 또한 일부 로그 메서드와 삼각 함수 메서드도 있습니다. 2 ** 3 === 8, 특히 대규모 연산의 경우 연산 결과의 마지막 숫자가 다릅니다.

Array.from 배열형 객체와 탐색 가능한 객체를 배열로 변환하고 확장 연산자는 특정 객체를 배열로 변환할 수도 있습니다.

map 메소드와 유사하게 두 번째 매개변수를 허용하고 처리된 값을 배열로 반환할 수 있습니다. .of는 값 집합을 배열로 변환합니다.

  1. copyWithin은 지정된 위치의 멤버를 다른 위치로 복사합니다.
    Array.prototype.copyWithin(target, start = 0, end = this.length)

  2. find는 첫 번째 정규 멤버를 찾습니다. 매개변수는 콜백 함수입니다.

    findIndex는 첫 번째 정규 배열 멤버를 반환합니다.

  3. fill의 위치는 두 번째 및 세 번째 매개변수로 시작 및 세 번째 매개변수를 지정할 수 있습니다. 끝 위치;

  4. 키, 값, 항목

  5. 포함, indexOf는 의미가 충분하지 않으며 내부적으로 사용됩니다. = == 판단,

    [NaN].indexOf(NaN) // -1 , [NaN] .includes(NaN) // true

    Map의 has는 키 이름을 찾는 데 사용되며 Set의 has는 값을 찾는 데 사용됩니다.
  6. 배열의 빈 위치에는 값이 없습니다. [,,]에 0이 있습니다. // false, es6 빈 위치는 정의되지 않은 것으로 변환되며 빈 위치는 피해야 합니다

  7. 4.

  8. 함수의 확장이 허용됩니다. 이 함수는 꼬리가 아닌 매개 변수가 기본값을 설정하는 경우입니다. 값은 실제로 이 매개변수를 생략할 수 없습니다.

    기본값이 설정된 후 함수의 length 속성은 지정된 기본값 없이 값을 반환합니다. 설정된 기본값이 마지막 매개변수가 아닌 경우 length 속성은 더 이상 후속 매개변수에 포함되지 않습니다.

매개변수의 기본값이 설정되면 함수가 진행됩니다. 초기화를 선언하면 매개변수가 별도의 범위(컨텍스트)를 형성합니다. 초기화가 완료되면 이 범위는 사라집니다. 이 구문 동작은 매개변수 기본값이 설정되지 않은 경우 나타나지 않습니다.

  1. Rest 매개변수(...변수 이름)
    length属性,将返回没有指定默认值的参数个数;
    如果设置了默认值的参数不是尾参数,那么length属性也不再计入后面的参数了;

  2. 一旦设置了参数的默认值,函数进行声明初始化时,参数会形成一个单独的作用域(context)。等到初始化结束,这个作用域就会消失。这种语法行为,在不设置参数默认值时,是不会出现的。

  3. Rest参数(...变量名)

  4. 扩展运算符(...),将一个数组转为用逗号分隔的参数序列。

    /* 替代数组的apply方法 */// ES5的写法function f(x, y, z) {  // ...}var args = [0, 1, 2];
    f.apply(null, args);// ES6的写法function f(x, y, z) {  // ...}var args = [0, 1, 2];
    f(...args);/* --------------------------------- */// ES5的写法Math.max.apply(null, [14, 3, 77])// ES6的写法Math.max(...[14, 3, 77])// 等同于Math.max(14, 3, 77);/* --------------------------------- */// ES5的写法var arr1 = [0, 1, 2];var arr2 = [3, 4, 5];
    Array.prototype.push.apply(arr1, arr2);// ES6的写法var arr1 = [0, 1, 2];var arr2 = [3, 4, 5];
    arr1.push(...arr2);
    로그인 후 복사
  5. 箭头函数使用注意:

    (1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。

    (2)不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。

    (3)不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。

    (4)不可以使用yield命令,因此箭头函数不能用作 Generator 函数。

 

五. 对象的扩展

  1. 属性简写表示法

  2. 属性名表达式,[变量名]

  3. 方法的name属性返回函数名(即方法名)

  4. Object.is,与===基本一致,不同在于一是+0不等于-0,二是NaN

    스프레드 연산자(...)는 배열을 쉼표로 구분된 매개변수 시퀀스로 변환합니다.
    🎜
    // es5实现Object.isObject.defineProperty(Object, 'is', {
      value: function(x, y) {if (x === y) {      // 针对+0 不等于 -0的情况  return x !== 0 || 1 / x === 1 / y;
        }// 针对NaN的情况return x !== x && y !== y;
      },
      configurable: true,
      enumerable: false,
      writable: true});
    로그인 후 복사
    🎜🎜🎜🎜화살표 함수 사용 시 참고 사항: 🎜🎜(1) 함수 본문의 this 개체는 사용되는 개체가 아니라 정의된 개체입니다. 🎜🎜(2)는 생성자로 사용할 수 없습니다. 즉, new 명령을 사용할 수 없습니다. 그렇지 않으면 오류가 발생합니다. 🎜🎜(3) arguments 개체는 함수 본문에 존재하지 않으므로 사용할 수 없습니다. 이를 사용하려면 대신 나머지 매개변수를 사용할 수 있습니다. 🎜🎜(4) yield 명령을 사용할 수 없으므로 화살표 함수를 생성기 함수로 사용할 수 없습니다. 🎜🎜🎜🎜 🎜🎜 5. 객체 확장 🎜🎜🎜🎜 속성 약어 🎜🎜🎜🎜속성 이름 표현, [변수 이름] 🎜🎜🎜🎜메서드의 name 속성은 함수 이름( 즉, 메소드 이름) 🎜🎜🎜🎜Object.is, 기본적으로 ===와 동일합니다. 차이점은 먼저 +0-0과 같지 않다는 것입니다. , 둘째, NaN은 그 자체와 같습니다🎜🎜🎜rrreee🎜
  5. Object.sign(target, o1, o2)은 객체를 병합하는 데 사용됩니다. 동일한 이름을 가진 속성이 있으면 나중에 이전 속성을 덮어쓰게 됩니다.
    정의되지 않고 null은 객체로 변환될 수 없기 때문입니다. , 매개변수로 사용되면 오류가 보고됩니다. Object.getOwnPropertyDescriptor 메소드는 속성의 설명 개체를 얻을 수 있습니다.

  6. 속성 순회:

    for...in, Object.keys, Object.getOwnPropertyNames(obj), Object.getOwnPropertySymbols(obj), Reflect.ownKeys(obj)

  7. __proto__ 및 Object.setPrototypeOf( ) 객체의 프로토타입 객체를 설정하는 데 사용되는 동일한 함수가 있습니다. Object.getPrototypeOf()

  8. Object.keys(), Object.values(), Object.entries()

  9. Object.getOwnPropertyDescriptors는 모두를 반환합니다. 지정된 객체의 속성 자체 속성의 설명 객체(상속되지 않은 속성)

위 내용은 es6의 다양한 데이터 유형의 확장된 예에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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