首页 > 编程语言 >浏览器前端 JavaScript Worker使用

浏览器前端 JavaScript Worker使用

时间:2023-02-15 09:44:05浏览次数:49  
标签:浏览器 log JavaScript Worker 线程 result console data

主Js文件内容:

//注意:
//使用前先判断浏览器是否支持
//Worker内的代码不可以操作DOM
//不能跨域加载Worker的js文件

if(window.Worker !== undefined)
{
    //新建Worker,类似创建子线程
    let worker = new Worker('worker.js');

    //设置Worker的监听,用于接收子线程向主线程发送数据
    worker.onmessage = function (event) {
        console.log('主线程接收子线程的数据');
        console.log(event.data);
    };

    //主线程向子线程发送数据
    worker.postMessage([1,2,3]);
}

worker.js文件内容:

//设置Worker监听,用于接收来自主线程的数据
onmessage = function (event) {
    //主线程传进来的数据
    let data = event.data;
    console.log(data);

    //进行计算
    let result = arrayAccumulate(data);

    //子线程向主线程发送数据
    postMessage(result);
}


//功能:累加,用于测试使用
function arrayAccumulate(data)
{
    console.log('begin');

    let result = 0;

    data.forEach(function (item){
        result += item;
    })

    console.log('end');
    return result;
}

标签:浏览器,log,JavaScript,Worker,线程,result,console,data
From: https://www.cnblogs.com/cqpanda/p/17081827.html

相关文章

  • JavaScript模块化方案的演进史
    JavaScript语言诞生至今,模块规范化之路曲曲折折。社区先后出现了各种解决方案,包括AMD、CMD、CommonJS等,而后ECMA组织在JavaScript语言标准层面,增加了模块功能(因为该......
  • 多御浏览器安卓1.8.5版本更新,小说资讯视频随心看
    多御浏览器新版本来袭,这是2023年以来的第三次更新。此次多御浏览器更新安卓1.8.5版本,增加了资讯、视频、小说栏目。更加丰富的功能,实用的海量工具,大大增加了可玩性,满足不同......
  • javascript 高级编程系列 - Web Workers
    Webworkders的规范让javascript在后台运行脱离了UI线程,从而解决了大量计算阻塞UI线程导致卡死的问题。在Webworkers没有出现之前,我们可以使用window.setTimeout异步方......
  • JavaScript对象属性的特性高级功能
    “usestrict”/创建一个对象最简单的方式:创建一个Object的实例,然后再为它添加属性和方法/varperson=newObject();person.name=“Hongbin”;person.age=21;per......
  • Vue项目在ie浏览器中显示空白的兼容性问题解决
    问题:在ie浏览器中页面报错:SCRIPT5022:SecurityError小编也不知道原因是什么,小编是尝试了以下几种方式才显示出来,这里建议大家试试看。1、下载软件包:@babel/polyfill执......
  • 好用的浏览器有哪些
    GoogleChromeFirefoxSafariMicrosoftEdgeOperaVivaldiChromiumMaxthonTorchSeaMonkeyAvantLunascapeNetscapeComodoDragonSleipnirEpicK-MeleonAvast......
  • JavaScript 大文件上传下载解决方案
    ​ javaweb上传文件上传文件的jsp中的部分上传文件同样可以使用form表单向后端发请求,也可以使用ajax向后端发请求    1.通过form表单向后端发送请求     ......
  • centos7下远程图形化浏览器解决方案
    背景:越来越多的项目会首选linux作为基础系统,一般情况下客户提供的都是没有图像化的linux,但有些配置需要通过浏览器来修改并查看(比如nacos,roketmq-admin等),因此便需要centos......
  • 从混沌到规范:JavaScript模块化方案的演进史
    前言JavaScript语言诞生至今,模块规范化之路曲曲折折。社区先后出现了各种解决方案,包括AMD、CMD、CommonJS等,而后ECMA组织在JavaScript语言标准层面,增加了模块功能(因......
  • JavaScript-面向对象的理解
    Everythingisobject(万物皆对象)作为开发大家都非常熟悉的一句话。(1)对象是单个事物的抽象。在生活中大的事物圈子,比如一只猫、一本书、一个人,都可以理解为对象(objec......