关于flutter:15-个-JavaScript-代码示例及其-Dart-对应代码

9次阅读

共计 2391 个字符,预计需要花费 6 分钟才能阅读完成。

做为 开发过 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';
  
  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)

6. array.length > 0 和 list.isNotEmpty

查看数组是否为空

  array.length > 0

Dart 里,是这样

  list.isNotEmpty

7. array.length === 0 和 list.isEmpty

查看数组是否为空

  array.length === 0

Dart 里,是这样

  list.isEmpty

8. parseInt 和 int.parse

在 JavaScript 中将字符串转换为整数,能够应用

  parseInt('123')

在 Dart 里,是这样

  int.parse('123')

9. parseFloat 和 double.parse

双精度浮点数的应用如下:

  parseFloat('1.23')

在 Dart 里,是这样

  double.parse('1.23')

10. 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);

11. 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

12. array.indexOf() 和 list.indexOf()

在 JavaScript 和 Dart 中,indexOf 是一种用于在数组或列表中查找索引地位的办法。没有则返回 -1

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

13. toString

在 JavaScript 中,会应用 toString()将另一种数据类型的值转换为字符串。它实用于整数、浮点数、布尔值、数组和对象。对于对象的话会失去以下后果:

var x = {id: 1}
console.log(x.toString())
=> '[object Object]'

然而两者会有肯定的差异,如下:

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

14. array.every 和 list.every

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

15. 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)

如果你还有其余须要补充的?在评论中让我晓得哈!

正文完
 0