JavaScript代码及其 Dart 对应代码

简介: 15 个 JavaScript 代码示例及其 Dart 对应代码

做为 开发过React/React Native 的工程师,在刚开始接触Flutter 开发的时候,一定会遇到这种情况,对于某个功能你能很熟练使用特定Javascript语法去完成,但是对于Flutter 开发,对应的Dart的语法又是什么?往往要再翻开Dart文档去寻找对应的语法。在此分享15 个 JavaScript 代码示例及其 Dart 对应代码。

  1. JSON.stringify 和 JsonEncoder().convert
    在 JavaScript 中,如果要将对象转换为 JSON 字符串,可以使用:

    JSON.stringify(yourObject)
    在 Dart 中,只需导入'dart:convert'即可使用:

    import 'dart:convert';

    JsonEncoder().convert(yourObject)

  2. JSON.parse和JsonDecoder().convert
    在 JavaScript 中将 JSON 转换为对象,会使用以下代码:

    JSON.parse(yourJson)
    在 Dart 中,只需导入'dart:convert'即可使用:

    import 'dart:convert';
    //代码效果参考:http://qq.jxmayflora.com/sitemap/post1.html

    JsonDecoder().convert(yourJson)

  3. array.push和list.add
    在 JavaScript 中,要添加'hello'到数组中,可以使用

    array.push('hello')
    在 Dart 中,这样使用,

    list.add('hello')

  4. array.splice和list.sublist
    在 JavaScript 中,数组删除第一个元素(索引值为0)

    array.splice(0, 1)
    在Dart中, 返回索引范围(1 和 3)内的新列表

    list.sublist(1, 3)

  5. array.splice和list.removeAt
    array.splice与#4点一样

在Dart中, 删除索引值为itemIndex的值

list.removeAt(itemIndex)

  1. array.length > 0和list.isNotEmpty
    检查数组是否为空

    array.length > 0
    Dart里,是这样

    list.isNotEmpty

  2. array.length === 0和list.isEmpty
    检查数组是否为空

    array.length === 0
    Dart里,是这样

    list.isEmpty

  3. parseInt和int.parse
    在 JavaScript 中将字符串转换为整数,可以使用

    parseInt('123')
    在Dart里,是这样

    int.parse('123')

  4. parseFloat 和 double.parse
    双精度浮点数的使用如下:

    parseFloat('1.23')
    在Dart里,是这样
    //代码效果参考:http://kuaishou.ahljwz.cn/sitemap/post1.html

    double.parse('1.23')

  5. array.some 和 list.any
    在 JavaScript 中,array.some()方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的。
    例如,如果想查看数组[1, 2, 3, 4, 5, 6, 7]是否有任何大于 5 的数字:

    var some = array.some(x=>x > 5)
    在Dart,是这样的,

    array.any((x)=>x > 5);

  6. array.findIndex和list.indexWhere
    Javascript的array.findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回-1。
    Dart用的是list.indexWhere,只是用法不一样

var notes = ['do', 're', 'mi', 're'];
// JavaScript
notes.findIndex(x=>x.indexOf("r") > -1) // 1
// Dart
notes.indexWhere((note) => note.startsWith('r')); // 1
「Tip」 在 Dart 中,还可以在函数后面传递一个参数来提供起始索引。如下:

notes.indexWhere((note) => note.startsWith('r'), 2 ); // 3

  1. array.indexOf() 和 list.indexOf()
    在 JavaScript 和 Dart 中,indexOf是一种用于在数组或列表中查找索引位置的方法。没有则返回-1

var author = ['Edgar Allen Poe', 'JK Rowling', 'Ernest Hemingway']
author.indexOf('JK Rowling') // 1

  1. toString
    在 JavaScript 中,会使用toString()将另一种数据类型的值转换为字符串。它适用于整数、浮点数、布尔值、数组和对象。对于对象的话会得到以下结果:

var x = {id: 1}
console.log(x.toString())
=> '[object Object]'
但是两者会有一定的差别,如下:

// Dart
String test = 1.toString() // '1'
// JavaScript
var x = 1.toString() // 未捕获的语法错误:无效或意外的标记

  1. array.every 和 list.every
    every() 方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。用法与上面array.some 和 list.any相似

  2. map, forEach, filter, find等
    除了语法上的一些差异之外,上述所有方法都在 JavaScript 和 Dart 之间共享。当map用于test等于的数组时,请参见如下[1, 2, 3, 4, 5]。
    Javascript:

    // 其他类似
    test.map(x=>x*2)
    Dart:

est.map((x)=>x*2)

相关文章
|
8天前
|
JavaScript 前端开发 Python
用python执行js代码:PyExecJS库
文章讲述了如何使用PyExecJS库在Python环境中执行JavaScript代码,并提供了安装指南和示例代码。
45 1
用python执行js代码:PyExecJS库
|
4天前
|
编解码 前端开发 JavaScript
javascript检测网页缩放演示代码
javascript检测网页缩放演示代码
|
6天前
|
Web App开发 JavaScript 前端开发
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
|
7天前
|
存储 JavaScript 前端开发
webSocket+Node+Js实现在线聊天(包含所有代码)
文章介绍了如何使用WebSocket、Node.js和JavaScript实现在线聊天功能,包括完整的前端和后端代码示例。
34 0
|
4天前
|
存储 JavaScript 前端开发
改进JavaScript代码,给水果有序赋色
改进JavaScript代码,给水果有序赋色
|
6天前
|
存储 JSON JavaScript
JavaScript帮我编写快递自动分拣的代码,区分省份市区县城乡镇
JavaScript帮我编写快递自动分拣的代码,区分省份市区县城乡镇在JavaScript中编写一个用于快递自动分拣的代码,区分省份、市区、县、城乡镇,通常意味着你需要一个数据结构来存储这些地理区域的信息,并编写逻辑来根据快递地址中的信息将其分配到正确的分类中。 这里,我将提供一个简化的示例,说明如何使用JavaScript对象和函数来实现这一功能。请注意,这个示例是高度简化的,并且假设你已经有了某种方式(如正则表达式或API调用)来从快递地址中提取省份、市区、县等信息。 ----------------------------------- ©著作权归作者所有:来自51CTO博客作者goS
|
7天前
|
JavaScript 前端开发 Python
python执行js代码
本文档详细介绍如何安装Node.js环境及PyExecJS库,并提供示例代码展示其功能。首先,通过指定链接安装Node.js,安装完毕后可在命令行中输入`node --version`来验证安装是否成功。接着,使用`pip install PyExecJS`安装PyExecJS库,该库允许Python程序执行JavaScript代码。文档还提供了多个示例代码,展示了如何在Python环境中执行和编译JavaScript代码,并可以选择特定的JavaScript运行时环境,如Node.js或JScript。最后,通过具体案例展示了PyExecJS的功能与使用方法。
14 3
|
15天前
|
JavaScript
网站内容禁止复制的js代码
网站内容禁止复制的js代码
|
21天前
|
缓存 JavaScript 前端开发
js和html代码一定要分离吗
JavaScript(JS)和HTML代码的分离虽非绝对必要,但通常被推荐
|
4天前
|
C++ Windows
HTML+JavaScript构建C++类代码一键转换MASM32代码平台
HTML+JavaScript构建C++类代码一键转换MASM32代码平台
下一篇
无影云桌面