Phantomjs,Casperjs重要的概念:执行顺序

简介: <div class="markdown_views"><h2 id="phantomjscasperjs重要的概念执行顺序">Phantomjs,Casperjs重要的概念:执行顺序</h2><p>Phantomjs和Javascript一样,是基于消息驱动的。代码的执行都是异步化的。 <br>要理解phantomjs的代码执行是基于一个step栈。在执行脚本时,会将

Phantomjs,Casperjs重要的概念:执行顺序

Phantomjs和Javascript一样,是基于消息驱动的。代码的执行都是异步化的。
要理解phantomjs的代码执行是基于一个step栈。在执行脚本时,会将所有step压入栈。
wait,then,open,等这些都是一个step。
举几个例子:

casper.wait(1000,function() {
    do1
}
do2

do1和do2执行顺序是怎么样的?
wait方法是异步的!!!,do2会先执行!!!,为了让do1和do2顺序执行,必须这样:

casper.wait(1000,function() {
    do1
}
casper.then(function() {
    do2
}

wait方法先被压入step栈,然后then被压入栈。

讨论下then的用法

then() 方法将一个新的step压入栈,一个step是一个javascript的函数:
1. 等待前一个step完成后执行
2. 等待页面请求的url或其他page加载

来看一段代码:

var casper = require('casper').create();

casper.start();

casper.then(function step1() {
    this.echo('this is step one');
});

casper.then(function step2() {
    this.echo('this is step two');
});

casper.thenOpen('http://google.com/', function step3() {
    this.echo('this is step 3 (google.com is loaded)');
});

casper.run();

可以将steps栈打印出来方便调试:

require('utils').dump(casper.steps.map(function(step) {
    return step.toString();
}));

可以看到栈信息是这样的:

$ casperjs test-steps.js
[
    "function step1() { this.echo('this is step one'); }",
    "function step2() { this.echo('this is step two'); }",
    "function _step() { this.open(location, settings); }",
    "function step3() { this.echo('this is step 3 (google.com is loaded)'); }"
]

栈信息里,有一个_step(),这个是phantomjs自动帮我们加的,用于加载google.com这个url,然后step3才能执行。
栈里的step,必须在调用run后才真正开始执行。

递归的step

如果一个step内部有多个step,会怎么样?代码大概是这样:

casper.then(function() {
    casper.then(function() {
        do1
        casper.then(function() {
            do2
        })
        do3
    })
    do4
)

casper.then(function() {
    do5
})
一个step内部递归的step,在运行时,会动态压入所在step的内部栈。所以,执行顺序是:do4,do1,do3,do2,do4

非异步的方法

在sendAjax的时候,将asyn参数设为false,就可以正常执行,得到返回值result,否则是空

 var result = this.evaluate(function () {
    return __utils__.sendAJAX(url, 'GET', null, false,
        {
            contentType: 'application/x-www-form-urlencoded; charset=UTF-8'
        });
}, {url: url});

重大坑

exit()方法是异步的,也就是说,step1中调用exit,step2也有可能执行。

相关文章
|
4月前
|
自然语言处理 JavaScript 前端开发
深入理解JavaScript中的闭包:原理、应用与代码演示
【10月更文挑战第12天】深入理解JavaScript中的闭包:原理、应用与代码演示
|
8月前
|
Go 调度 Python
Django 视图探秘:FBV与CBV注册方式的异同,揭秘as_view()的执行魔法
Django 视图探秘:FBV与CBV注册方式的异同,揭秘as_view()的执行魔法
|
Web App开发 移动开发 JavaScript
这一次,彻底弄懂 JavaScript 执行机制(一)
这一次,彻底弄懂 JavaScript 执行机制
211 5
|
Web App开发 自然语言处理 JavaScript
带你读《现代Javascript高级教程》十、JavaScript引擎的工作原理:代码解析与执行(1)
带你读《现代Javascript高级教程》十、JavaScript引擎的工作原理:代码解析与执行(1)
108 0
|
Web App开发 缓存 JavaScript
带你读《现代Javascript高级教程》十、JavaScript引擎的工作原理:代码解析与执行(2)
带你读《现代Javascript高级教程》十、JavaScript引擎的工作原理:代码解析与执行(2)
|
前端开发 JavaScript
这一次,彻底弄懂 JavaScript 执行机制(二)
这一次,彻底弄懂 JavaScript 执行机制
106 0
|
JavaScript 前端开发
vue中v-show和v-if指令的共同点和不同点?
vue中v-show和v-if指令的共同点和不同点?
101 0
|
JavaScript 前端开发
📕 重学JavaScript:如何实现一个`call`/`apply`?
这次要说的 call/apply 方法其实和 bind 极其类似。
92 0
|
JavaScript 前端开发 Unix
webpack原理篇(五十九):loader 的链式调用与执行顺序
webpack原理篇(五十九):loader 的链式调用与执行顺序
308 0
webpack原理篇(五十九):loader 的链式调用与执行顺序
|
数据挖掘 Perl
Mummer 用法简析
Mummer 用法简析
171 0
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等