单线程 - 只能关注一件事

//  循环运行期间， Js 执行和 DOM 渲染暂时卡顿

console.log('start')

var i , sum = 0;

for ( i = 0; i < 100000000; i ++) { 

  sum += i;

}

console.log(sum);

// alert 不处理完成， Js  执行和  DOM 渲染时卡顿

console.log(1)

alert('hello')

console.log(2)

原因 - 避免 DOM 渲染冲突

- 浏览器需要渲染 DOM

- Js 可以修改 DOM 结构

- Js 执行的时候，浏览器 DOM 渲染会暂停

- 两端Js 也不能同事执行（都修改 DOM 就会冲突）

- webworker 支持多线程，但是不能访问 DOM

解决方案 - 异步

console.log（100）

settimeout（function （） {  

console.log（200） //  1000ms 之后执行这段代码

}，1000）                   //  先不管这段代码，让其他Js   代码运行

console.log（300）

console.log (400)

console.log（100）

$.ajax({

    url:"xxxx",

    success:function( result ) { // ajax 加载完才执行

        console.log(result) //先不管它，先让其他js 代码执行

    }

});

console.log(200)

console.log(300)