深入分析beforeEach函数

一、beforeEach怎么读

beforeEach函数是Jasmine中的一个生命周期函数，它在测试套件中的每个用例执行前都会被调用。在中文中，beforeEach函数直译为“在每个事情发生前”，也就是在每个用例执行前。

在测试过程中使用beforeEach函数有助于减少重复代码，同时方便了测试数据的初始化和清理。在Jasmine中，beforeEach函数是一个开放的钩子函数，我们可以在该函数中进行测试用例相关的准备工作。

二、beforeEach首次不执行

在beforeEach函数中的代码不会在测试套件执行前执行，而是在测试用例第一次执行前执行。例如：

beforeEach(() => {
  console.log("beforeEach");
})

it("测试用例 1", () => {
  console.log("测试用例 1");
})

it("测试用例 2", () => {
  console.log("测试用例 2");
})

以上代码输出结果为：

测试用例 1
beforeEach
测试用例 2
beforeEach

beforeEach函数第一次执行是在第一个测试用例执行前，而不是在测试套件执行前。这种行为是Jasmine设计的一个特性，主要是方便开发者针对每个具体测试用例进行测试。

三、beforeach跟aftereach

beforeEach和afterEach是一对生命周期函数，分别表示在测试套件中的每个用例执行前和执行后运行指定的代码。当我们需要在每个用例执行前后进行统一的准备和清理工作时，beforeEach和afterEach结合使用可以很好地完成这一任务。

以下是beforeEach和afterEach的示例代码：

beforeEach(() => {
  console.log("beforeEach");
})

afterEach(() => {
  console.log("afterEach");
})

it("测试用例 1", () => {
  console.log("测试用例 1");
})

it("测试用例 2", () => {
  console.log("测试用例 2");
})

以上代码输出结果为：

测试用例 1
afterEach
beforeEach
测试用例 2
afterEach
beforeEach

beforeEach和afterEach函数分别在每个测试用例执行前和执行后分别被调用，执行顺序是 beforeEach()->test case-> afterEach()-> beforeEach()->test case-> afterEach()。

四、each和every区别

Jasmine中的each函数和every函数都可以用于测试集的遍历，它们的区别在于它们是如何处理异步数据的

当我们需要测试一个数组中的每个元素，可以使用each函数，例如：

describe("测试集合", () => {
  const test_data = [1, 2, 3];
  beforeEach(() => {
    console.log("beforeEach");
  })
  it("测试", () => {
    expect().nothing();
  })
  afterEach(() => {
    console.log("afterEach");
  })

  test_data.forEach((item) => {
    it(`测试 ${item}`, () => {
      console.log(item);
    })
  })
})

以上代码输出结果为：

测试 1
测试 2
测试 3

而如果使用every函数来遍历数组，则要使用async/await的方式处理它的异步特性。

describe("测试集合", () => {
  const test_data = [1, 2, 3];
  beforeEach(() => {
    console.log("beforeEach");
  })
  it("测试", () => {
    expect().nothing();
  })
  afterEach(() => {
    console.log("afterEach");
  })

  test_data.every(async (item) => {
    await it(`测试 ${item}`, () => {
      console.log(item);
    })
    return true;
  })
})

以上代码的输出结果与前面的each函数遍历结果相同。

五、beforeEach函数完整代码示例

describe("测试集合", () => {
  const test_data = [1, 2, 3];
  beforeEach(() => {
    console.log("beforeEach");
  })
  it("测试", () => {
    expect().nothing();
  })
  afterEach(() => {
    console.log("afterEach");
  })

  test_data.forEach((item) => {
    it(`测试 ${item}`, () => {
      console.log(item);
    })
  })
})

以上代码为beforeEach函数的一个完整示例，使用beforeEach函数可以有效地进行测试集合的初始化，避免了重复代码和UI自动化测试误判的发生。