为什么要学习鸿蒙开发

大家好，我是石小石！最近一直在寻找新的工作机遇，但是行情确实不好，几乎没人理我。机缘之下，我搜了一下鸿蒙开发，看起来还不错！

于是，我深入的探索、学习了一下鸿蒙，得出一个重要结论：

前端非常适合学习鸿蒙，而且越早越好！

首先，我并不是贩卖焦虑，我并不是想表达前端已死、前端开始没落之类的意思！我一直认为，前端正在茁壮成长，前端永远不会被淘汰的！

之所以说前端适合或者应该学习鸿蒙，我的看法如下：

• 鸿蒙方舟开发语言ArkTs保持TypeScript（简称TS）基本语法风格的基础上，对前端来说，接入难度低。
• 鸿蒙ArkTs融合了很多优秀的语言，学习鸿蒙可以大幅度提升前端的代码水平。
• 前端核心竞争力弱于后端，学习鸿蒙可以提升我们的地位和价值。
• 随着华为生态的壮大，鸿蒙开发将是未来一大热点，目前鸿蒙开发者很好，现在学习，以后找工作什么的都具备优势。

鸿蒙开发简介

作为一门新语言，大家一定关注的是学习成本和产出性价比。那么很高兴的告诉前端同学，咱们学习嘎嘎快！

鸿蒙开发基于方舟开发语言ArkTs，只要我们开发一套代码，就可以部署手机、平板、TV、智慧屏（含车载）和穿戴设备，这一点，还是有一定优势的。

其次，鸿蒙的开发文档也是非常详细全面，完全满足我们的开发需求，大家感受下：

再者，鸿蒙开发生态也很完善，HarmonyOS SDK几乎提供了我们所能涉及的所有开发工具

前端学习鸿蒙开发的优势

之所以说前端学习鸿蒙开发有一定优势，主要基于方舟开发语言ArkTs本身。

基础语法接近TypeScript

首先，ArkTs保持了TypeScript的基本语法风格，前端看起来会比较熟悉

// 导入模块
import { collections } from '@kit.ArkTS';

// 声明一个字符串变量
let greeting: string = "Hello, ArkTS";

// 声明一个数字变量
let age: number = 25;

// 声明一个数组
let numbers: number[] = [1, 2, 3, 4, 5];

// 声明一个对象
let person: {
    name: string;
    age: number;
    isDeveloper: boolean;
} = {
    name: "John Doe",
    age: 25,
    isDeveloper: true
};

// 声明一个函数
function greet(name: string): string {
    return `Hello, ${name}`;
}

// 其他语法
let concatArray : collections.ConcatArray<string> = new collections.Array<string>('a', 'b', 'c');
let joinedString = concatArray.join('-'); // 返回 "a-b-c"

当然，ArkTs也具备java中装饰器的概念，对后端来说，也是比较亲切地

// 构造一个用户自定义的Sendable数据结构
@Sendable
class CustomData implements lang.ISendable {
    data1: number;
    data2: string;
    constructor(data1: number, data2: string) {
        this.data1 = data1;
        this.data2 = data2;
    }
}

UI框架可以完全用前端三件套开发

鸿蒙也是有一套UI框架的，叫做ArkUI

简单来说，ArkUI是基于ArkTS的声明式的UI开发范式， 是ArkTS语言的一个具体应用或扩展，用于构建用户界面。ArkTs和ArkUI前端同学可以简单理解为js和element UI的关系。

借助ArkUI，我们可以直接写出类似小程序、vue的代码

一个简化的项目结构

// 目录结构
app.js                              用于全局JavaScript逻辑和应用生命周期管理
├── pages                           pages目录用于存放所有组件页面
│   ├── index
│   │   ├── index.html              描述当前页面的文件布局结构
│   │   ├── index.css               描述页面样式
│   │   └── index.js                处理页面间的交互

app.js是应用的一些声明周期

export default {
    onCreate() {
        console.info('Application onCreate');
    },
    onDestroy() {
        console.info('Application onDestroy');
    }
};

html是基于ArkUI组件的布局

<div class="container">
    <text class="title">你好！鸿蒙！</text>
    <text>跳转</text>
</div>

index.css 和前端css没有区别

index.js是页面的一些交互逻辑，像极了vue

export default {
    data: {
        title: ''
    },
    onInit() {
        this.title = this.$t('strings.world');
    }
}

注：对于一些大型的app开发，官方不建议使用这种类js的开发范式，要使用ArkTs声明开发范式

综上，完全可以证明前端确实适合学习鸿蒙开发，简单易上手！

原文链接：https://juejin.cn/post/7393173571969089576