js怎么进行同步执行

JavaScript028

js怎么进行同步执行,第1张

**

* 解决异步加载问题

* */

function promise1(fun){

        this.fun1=function(){}

        this.fun2=function(){}

        try{

            fun(this.sol)

        }catch(err){

           

        }   

}

promise1.prototype={

fun1:function(){},

        fun2:function(){},

    sol:function(res){

        setTimeout(function(){

            promise1.prototype.fun1(res)

            promise1.prototype.fun2(res)

        },0)

    },

    then:function(fun1){

        promise1.prototype.fun1=fun1

        return this

    },

    err:function(fun2){

        promise1.prototype.fun2=fun2

    }

}

/**

*方法使用:方法1比方法2先执行

**/

new promise1(function(door){

functionA(door)//方法1

}).then(function(){

functionB()        //方法2

})

    functionA : fucntion(){

door

javascript语言是单线程机制。所谓单线程就是按次序执行,执行完一个任务再执行下一个。

对于浏览器来说,也就是无法在渲染页面的同时执行代码。

单线程机制的优点在于实现起来较为简单,运行环境相对简单。缺点在于,如果中间有任务需要响应时间过长,经常会导致

页面加载错误或者浏览器无响应的状况。这就是所谓的“同步模式”,程序执行顺序与任务排列顺序一致。对于浏览器来说,

同步模式效率较低,耗时长的任务都应该使用异步模式;而在服务器端,异步模式则是唯一的模式,如果采用同步模式个人认为

服务器很快就会出现12306在高峰期的表现。。。。

异步模式的四种方式:

1.回调函数callback

所谓回调函数,就是将函数作为参数传到需要回调的函数内部再执行。

典型的例子就是发送ajax请求。例如:

$.ajax({

async: false,

cache: false,

dataType: 'json',

url: "url",

success: function(data) {

console.log('success')

},

error: function(data) {

console.log('error')

}

})

当发送ajax请求后,等待回应的过程不会堵塞程序运行,耗时的操作相当于延后执行。

回调函数的优点在于简单,容易理解,但是可读性较差,耦合度较高,不易于维护。

2.事件驱动

javascript可以称之为是基于对象的语言,而基于对象的基本特征就是事件驱动(Event-Driven)。

事件驱动,指的是由鼠标和热键的动作引发的一连串的程序操作。

例如,为页面上的某个

$('#btn').onclick(function(){

console.log('click button')

})

绑定事件相当于在元素上进行监听,是否执行注册的事件代码取决于事件是否发生。

优点在于容易理解,一个元素上可以绑定多个事件,有利于实现模块化;但是缺点在于称为事件驱动的模型后,流程不清晰。

3.发布/订阅

发布订阅模式(publish-subscribe pattern)又称为观察者模式(Observer pattern)。

该模式中,有两类对象:观察者和目标对象。目标对象中存在着一份观察者的列表,当目标对象

的状态发生改变时,主动通知观察者,从而建立一种发布/订阅的关系。

jquery有相关的插件,在这不是重点不细说了。。。。回头写个实现贴上来

4.promise模式

promise对象是CommonJS工作组提供的一种规范,用于异步编程的统一接口。

promise对象通常实现一种then的方法,用来在注册状态发生改变时作为对应的回调函数。

promise模式在任何时刻都处于以下三种状态之一:未完成(unfulfilled)、已完成(resolved)和拒绝(rejected)。以CommonJS

Promise/A

标准为例,promise对象上的then方法负责添加针对已完成和拒绝状态下的处理函数。then方法会返回另一个promise对象,以便于形成promise管道,这种返回promise对象的方式能够支持开发人员把异步操作串联起来,如then(resolvedHandler,

rejectedHandler)。resolvedHandler

回调函数在promise对象进入完成状态时会触发,并传递结果;rejectedHandler函数会在拒绝状态下调用。

Jquery在1.5的版本中引入了一个新的概念叫Deferred,就是CommonJS promise A标准的一种衍生。可以在jQuery中创建

$.Deferref的对象。同时也对发送ajax请求以及数据类型有了新的修改,参考JQuery API。

除了以上四种,javascript中还可以利用各种函数模拟异步方式,更有诡异的诸如用同步调用异步的case

只能用team里同事形容java和javascript的一句话作为结尾:

“写java像在高速路上开车,写javascript像在草原上开车”-------------以此来形容javascript这种无类型的语言有多自由

but,如果草原上都是坑。

方法1 内部用了var 表示内部变量 执行完一次后会自动释放;

方法2 内的变量cc不能与方法1重名;

示例代码如下 测试可以

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title></title>

<script language="javascript" type="text/javascript">

var str=''

function cfun(obj) { str += obj.value }

function selall(){

var cc = document.getElementsByTagName("input")

for (var i = 0i <cc.lengthi++) {

cfun(cc[i])

}

alert(str)

}

</script>

</head>

<body>

<input type="text" id="txt1" value="你好" />

<input type="text" id="txt2" value="朋友" />

<a href="javascript:selall()">点击显示</a>

</body>

</html>