语法前置

125 阅读2分钟
  • 用 prototype 方法可以节约内存和降低实例化的开销。不过

    prototype 方法只能声明 public 函数和属性,而类定义可以声明只在类的内

    部访问的 private 函数和属性。

模板字面量

const book = {
  name: '学习JavaScript数据结构与算法'
}

console.log(`你正在阅读${book.name}。
这是新的一行
这也是`)

函数默认参数值

function sum(x = 1, y = 2, z = 3) {
  return x + y + z;
}
console.log(sum(4, 2));

//es6之前
function sum(x, y, z) {
  if (x === undefined) x = 1;
  if (y === undefined) y = 2;
  if (z === undefined) z = 3;
  return x + y + z;
}

function sum() {
  var x = arguments.length > 0 && arguments[0] !== undefined ? arguments[0]
    : 1;
  var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1]
    : 2;
  var z = arguments.length > 2 && arguments[2] !== undefined ? arguments[2]
    : 3;
  return x + y + z;
}

es6 数组解构 一次初始化多个变量

let [x, y] = ['a', 'b']
[x, y] = [y, x]  //值互换

let [x, y] = ['a', 'b']
let obj = { x, y }
console.log(obj)

简写方法名

const hello = {
  name: 'abcdef',
  printHello() {
    console.log('Hello')
  }
}

const hello1 = {
  name: 'abcdef',
  printHello: function printHello() {
    console.log('Hello')
  }
}
console.log(hello.printHello());

es6 使用类编程

class Book {
  constructor(title, pages, isbn) {
    this.title = title
    this.pages = pages
    this.isbn = isbn
  }
  ptintIsbn() {
    console.log(this.isbn)
  }
}

//等价于
function Book(title, pages, isbn) { // {1}
  this.title = title;
  this.pages = pages;
  this.isbn = isbn;
}
Book.prototype.printTitle = function () {
  console.log(this.title);
};

继承

class ITBook extends Book {
  constructor(title, pages, isbn, technology) {
    super(title, pages, isbn);
    this.technology = technology;
  }
  printTechnology() {
    console.log(this.technology);
  }
}
let jsBook = new ITBook('学习 JS 算法', '200', '1234567890', 'JavaScript');
console.log(jsBook.title);
console.log(jsBook.printTechnology());

属性存取器

class Person {
  constructor(name) {
    this._name = name;
  }
  get name() {
    return this._name;
  }
  set name(value) {
    this._name = value;
  }
}
let lotrChar = new Person('Frodo');
console.log(lotrChar.name);
lotrChar.name = 'Gandalf';
console.log(lotrChar.name);
lotrChar._name = 'Sam';
console.log(lotrChar.name);

乘方运算符

const area = 3.14(r ** 2)

模块化

const circleArea = r => 3.14 * (r ** 2);
const squareArea = s => s * s;
export { circleArea, squareArea };

import { ca as circleArea, sa as squareArea } from './17-CalcArea';
console.log(circleArea(2));
console.log(squareArea(2));

//把整个模块当做一个变量来导入
import * as area from './17-CalcArea';
console.log(area.circle(2));
console.log(area.square(2));

//另一种方式
export const circleArea = r => 3.14 * (r ** 2);
export const squareArea = s => s * s;

//模块中只有一个成员
export default class Book {
  constructor(title) {
    this.title = title;
  }
  printTitle() {
    console.log(this.title);
  }
}

import Book from './17-Book'

TypeScript

类型判断

let age = 20; // 数
let existsFlag = true; // 布尔值
let language = 'JavaScript'; // 字符串

接口

interface Person {
  name: string;
  age: number;
}
function printName(person: Person) {
  console.log(person.name);
}

const john = { name: 'John', age: 21 };
const mary = { name: 'Mary', age: 21, phone: '123-45678' };
printName(john);
printName(mary);


interface Comparable {
  compareTo(b): number;
}
class MyObject implements Comparable {
  age: number;
  compareTo(b): number {
    if (this.age === b.age) {
      return 0;
    }
    return this.age > b.age ? 1 : -1;
  }
}

泛型

interface Comparable<T> {
  compareTo(b: T): number;
}
class MyObject implements Comparable<MyObject> {
  age: number;
  compareTo(b: MyObject): number {
    if (this.age === b.age) {
      return 0;
    }
    return this.age > b.age ? 1 : -1;
  }
}
  • 用尖括号向 Comparable 接口动态地传入 T 类型,可以指定 compareTo 函数的参数类型。