dart与JavaScript写法上的区别_jsgetter和setter方法

一、相似之处

1. 基础语法结构

· 均使用 if/else、for、while、switch 等控制流语句。

· 支持 // 单行注释和 /* */ 多行注释。

· 使用 {} 定义代码块。

示例：条件判断

// Dart

if (condition) {

print('True');

} else {

print('False');

}

// JavaScript

if (condition) {

console.log('True');

} else {

console.log('False');

}

2. 函数定义

· 支持函数作为一等公民（可赋值给变量、作为参数传递）。

· 支持箭头函数（简化单行函数）。

示例：箭头函数

// Dart

var add = (int a, int b) => a + b;

// JavaScript

const add = (a, b) => a + b;

3. 异步处理（async/await）

· 均支持 async/await 语法处理异步操作。

· 返回 Promise（JS）或 Future（Dart）。

示例：异步函数

// Dart

Future fetchData() async {

var data = await http.get('https://api.example.com');

print(data);

}

// JavaScript

async function fetchData() {

const data = await fetch('https://api.example.com');

console.log(data);

}

二、不同之处

1. 变量声明与类型

· Dart

· 显式声明类型（可选，但推荐）：int x = 10;

· 使用 var 自动推断类型：var name = 'Dart';

· 支持 final（不可变变量）和 const（编译时常量）。

· JavaScript

· 动态类型：let x = 10; 或 const name = 'JS';

· 无静态类型（需用 TypeScript 补充）。

示例：类型声明

// Dart

String name = 'Dart'; // 显式类型

final age = 25; // 不可变

const PI = 3.14; // 编译时常量

// JavaScript

let name = 'JS'; // 可变变量

const PI = 3.14; // 不可变常量

2. 类与继承

· Dart

· 更接近 Java/C#，支持 class、extends、implements、mixin。

· 构造函数可简化：ClassName(this.param1, this.param2);

· 支持命名构造函数：ClassName.named();

· JavaScript

· 基于原型链的继承（ES6 引入 class 语法糖）。

· 无接口（需通过约定或 TypeScript 实现）。

示例：类定义

// Dart

class Animal {

String name;

Animal(this.name); // 简化构造函数

void speak() => print('Sound');

}

class Dog extends Animal {

Dog(String name) : super(name);

@override

void speak() => print('Bark');

}

// JavaScript

class Animal {

constructor(name) {

this.name = name;

}

speak() {

console.log('Sound');

}

}

class Dog extends Animal {

speak() {

console.log('Bark');

}

}

3. 空安全（Null Safety）

· Dart

· 默认变量不可为 null，需显式声明可空：String? nullableName;

· 避免空指针异常。

· JavaScript

· 无内置空安全，变量默认可为 null 或 undefined。

示例：可空类型

// Dart

String? name; // 可空变量

name = null; // 允许

name.length; // 编译错误，需判空：name?.length

// JavaScript

let name = null;

console.log(name.length); // 运行时错误：Cannot read property 'length' of null

4. 集合操作

· Dart

· 使用 List 和 Map，支持强类型集合：List numbers = [1, 2, 3];

· 扩展操作符：var combined = [...list1, ...list2];

· JavaScript

· 使用 Array 和 Object（或 Map），动态类型。

· 扩展操作符：const combined = [...arr1, ...arr2];

示例：集合操作

// Dart

List numbers = [1, 2, 3];

List moreNumbers = [0, ...numbers]; // 合并列表

// JavaScript

const numbers = [1, 2, 3];

const moreNumbers = [0, ...numbers]; // 合并数组

5. 模块导入导出

· Dart

· 使用 import 和 export，支持库前缀和条件导入：

import 'package:http/http.dart' as http;

import 'src/utils.dart' show helperFunction;

· JavaScript

· 使用 import/export（ES6 模块）：

import http from 'http';

import { helperFunction } from './src/utils.js';

6. 字符串插值

· Dart

· 使用 $ 或 ${}：print('Hello $name, age: ${age + 1}');

· JavaScript

· 使用模板字符串：console.log(Hello {name}, age: {age + 1});

三、总结

· 相似点：基础语法、函数式特性、异步处理逻辑。

· 不同点：

· Dart 强调类型安全和代码规范（类似 Java/C#），JavaScript 更灵活（需依赖工具链如 TypeScript 约束）。

· Dart 的类系统更完善，JavaScript 依赖原型链。

· Dart 支持空安全，JavaScript 需自行处理空值。

代码风格对比示例

1. 函数式操作（过滤列表）

// Dart

List numbers = [1, 2, 3, 4];

var evenNumbers = numbers.where((n) => n % 2 == 0).toList();

// JavaScript

const numbers = [1, 2, 3, 4];

const evenNumbers = numbers.filter(n => n % 2 === 0);

2. 异步链式调用

// Dart

Future processData() async {

try {

var data = await fetchData();

var result = await process(data);

print(result);

} catch (e) {

print('Error: $e');

}

}

// JavaScript

async function processData() {

try {

const data = await fetchData();

const result = await process(data);

console.log(result);

} catch (e) {

console.error(`Error: ${e}`);

}

}

选择建议

· 若需强类型、跨平台 UI 开发（Flutter），选 Dart。

· 若需灵活快速开发 Web 应用或依赖庞大生态，选 JavaScript/TypeScript。