一种JavaScript代码转译方法及装置制造方法及图纸

本申请公开了一种JavaScript代码转译方法及装置。一种JavaScript代码转译方法包括：对待转译的ES6代码段进行解析，根据解析结果，确定所述待转译代码段中的get/set方法声明代码部分，将所述get/set方法所属类的class声明代码转译为function声明代码；将所述get/set方法的声明代码转译为利用DOM实现get/set的代码。本申请实施例所提供的技术方案，利用早期浏览器版本对DOM对象get/set方法的支持特性，通过创建DOM对象，将function上的所有属性和方法复制到该DOM对象上，然后借助function的return返回值来返回该DOM对象，从而得到能够在早期浏览器版本中正确运行的类的get/set方法代码。

【技术实现步骤摘要】

本申请涉及计算机应用
，尤其涉及一种JavaScript代码转译方法及装置。
技术介绍
JavaScript一种直译式脚本语言，目前已经被广泛用于Web应用开发，常用来为网页添加各种动态功能，为用户提供更流畅美观的浏览效果。ECMAScript是ECMA(EuropeanComputerManufacturersAssociation，欧洲计算机制造商协会)制订的一种开放的JavaScript语言规范，自ECMAScript3.0版本在1999年发布后，已经成为JavaScript的国际通用标准。目前主流的版本是在2011年发布的ECMAScript5.1版本(下文简称为ES5)，而ECMAScript的第六个版本(下文简称ES6)也已经在2015年6月17日正式发布。ES6在ES5的基础上做了重大改进，ES6增添了许多新特性，例如对类(class)的支持、对模块(module)的支持等等，许多开发人员已经开始尝试使用ES6来进行应用的开发。然而，对于热衷于使用语言最新特性的开发人员而言，需要面对一个实际的情况是：截止到发布日期，无论是浏览器环境还是服务器环境，都还没有一款完全支持ES6的JavaScript代理，因此目前对于使用ES6规范开发的应用，需要使用转译器(Transpiler)将ES6代码转译为ES5代码，以便所开发的应用能够在现有的Web环境中正常使用，转译器的工作原理示意图如图1所示。Babel和Traceur是开发人员目前常用的两种转译器，两者均可以实现ES6代码到ES5代码的转译功能，但是转译的结果只能兼容到较新的浏览器版本，<br>而对于一些早期的浏览器版本，例如IE8，则无法正常使用转译后的部分ES5代码。
技术实现思路
针对上述技术问题，本申请提供一种JavaScript代码转译方法及装置，技术方案如下：根据本申请的第一方面，提供一种JavaScript代码转译方法，该方法包括：对待转译的ES6代码段进行解析；根据解析结果，确定所述待转译代码段中的get/set方法声明代码部分，所述get/set方法包括：set方法或get方法；将所述get/set方法所属类的class声明代码转译为function声明代码；将所述get/set方法的声明代码转译为用于执行以下操作的功能代码：创建一DOM对象；将“this”关键字所指向对象的属性复制到所述DOM对象上；利用ES5的对象属性定义方法，将所述get/set方法定义到所述DOM对象上；以所述DOM对象作为返回值。根据本申请的第二方面，提供一种JavaScript代码转译装置，该装置包括：解析模块，用于对待转译的ES6代码段进行解析；定位模块，用于根据解析结果，确定所述待转译代码段中的get/set方法声明代码部分，所述get/set方法包括：set方法或get方法；类声明转译模块，用于将所述get/set方法所属类的class声明代码转译为function声明代码；get/set声明转译模块，用于将所述get/set方法的声明代码转译为用于执行以下操作的功能代码：创建一DOM对象；将“this”关键字所指向对象的属性复制到所述DOM对象上；利用ES5的对象属性定义方法，将所述get/set方法定义到所述DOM对象上；以所述DOM对象作为返回值。考虑到ES6中class在ES5中被转译为function，本申请实施例所提供的技术方案，利用早期浏览器版本对DOM对象get/set方法的支持特性，通过创建DOM对象，将function上的所有属性和方法复制到该DOM对象上，然后借助function的return返回值来返回该DOM对象，从而得到能够在早期浏览器版本中正确运行的类的get/set方法代码。应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本申请。附图说明为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请中记载的一些实施例，对于本领域普通技术人员来讲，还可以根据这些附图获得其他的附图。图1是JavaScript代码转译工作原理示意图；图2是本申请的JavaScript代码转译方法的流程示意图；图3是本申请的代码解析结果示意图；图4是本申请的JavaScript代码转译装置的结构示意图。具体实施方式为了使本领域技术人员更好地理解本申请中的技术方案，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行详细地描述，显然，所描述的实施例仅仅是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员所获得的所有其他实施例，都应当属于本申请保护的范围。ES6新增了对类(class)的支持，其中class语法主要包括以下6方面特点：class类声明、extends继承声明、constructor构造函数声明、普通方法声明、static静态方法声明、get/set方法声明。目前，前5种语法的ES6到ES5代码转译均已经被Babel和Traceur实现，并且转译结果能够良好兼容于各类主流浏览器。但是get/set方法声明的转译结果只能兼容到IE9以上的版本、以及其他浏览器(例如Chrome、Firefox、Safari、Opera等)的较新版本，考虑到IE浏览器的特殊性—与主流操作系统捆绑、用户数量大且更新进程缓慢，使用IE8及以下版本的用户数量依然较多，如何保证这部分用户也能够正常使用转译后的ES5代码仍然具有较大的实际意义。下面首先对现有技术的ES6到ES5代码转译方法做简单说明：对于ES6中的class，在ES5中可以用function来替代，一个class就是一个function，例如：ES6代码：classA{本文档来自技高网...

【技术保护点】
一种JavaScript代码转译方法，其特征在于，该方法包括：对待转译的ES6代码段进行解析，根据解析结果，确定所述待转译代码段中的get/set方法声明代码部分，所述get/set方法包括：get方法或set方法；将所述get/set方法所属类的class声明代码转译为function声明代码；将所述get/set方法的声明代码转译为用于执行以下操作的功能代码：创建一DOM对象；将“this”关键字所指向对象的属性复制到所述DOM对象上；利用ES5的对象属性定义方法，将所述get/set方法定义到所述DOM对象上；以所述DOM对象作为返回值。

【技术特征摘要】
1.一种JavaScript代码转译方法，其特征在于，该方法包括：对待转译的ES6代码段进行解析，根据解析结果，确定所述待转译代码段中的get/set方法声明代码部分，所述get/set方法包括：get方法或set方法；将所述get/set方法所属类的class声明代码转译为function声明代码；将所述get/set方法的声明代码转译为用于执行以下操作的功能代码：创建一DOM对象；将“this”关键字所指向对象的属性复制到所述DOM对象上；利用ES5的对象属性定义方法，将所述get/set方法定义到所述DOM对象上；以所述DOM对象作为返回值。2.根据权利要求1所述的方法，其特征在于，所述将“this”关键字所指向对象的属性复制到所述DOM对象上，具体为：将“this”关键字所指向对象的除constructor之外的属性复制到所述DOM对象上。3.根据权利要求1所述的方法，其特征在于，所述利用ES5的对象属性定义方法，将所述get/set方法定义到所述DOM对象上，包括：利用Object.defineProperty方法将所述get/set方法的声明名称、声明内容定义到所述DOM对象上。4.根据权利要求1所述的方法，其特征在于，所述利用ES5的对象属性定义方法，将所述get/set方法定义到所述DOM对象上，包括：创建一临时对象；将get/set方法所属类的父类的属性复制到所述临时对象上；将所述get/set方法的声明名称、声明内容赋值给所述临时对象；为get/set方法所属类的子类保存所述临时对象的当前内容；利用Object.defineProperties方法将所述临时对象定义到所述DOM对象上。5.根据权利要求1所述的方法，其特征在于，所述方法还包括：在转译结果中，添加转译触发代码，所述转译触发代码用于执行以下操作：判断浏览器版本是否满足预设要求；如果浏览器版本不满足预设要求，则触发执行所述功能代码。6.根据权利要求5所述的方法，其特征在于，所述方法还包括：在转译结果中，添加get/set方法直译代码；所述get...

【专利技术属性】
技术研发人员：郝立鑫，
申请(专利权)人：阿里巴巴集团控股有限公司，
类型：发明
国别省市：开曼群岛;KY