专栏首页微搭低代码玩转低代码开发-javascirpt基础语法
原创

玩转低代码开发-javascirpt基础语法

我们前边用了一定的篇幅介绍了低代码中CSS的常用语法,本篇我们开始我们的第二篇教程JavaScript。虽然很多低码工具宣传是提效工具,但它有个前提,就是你会开发。如果脱离开这个前提,那大概率你只能使用工具生成一些简单的应用。什么是简单应用?简单应用通常就是普通的增删改查,只能起到信息的记录作用。

但现实生活中,我们既然要做一套软件,大概率是要满足协同管理的需求,一谈到管理就绕不开要按照老板的管理思路去做定制开发。个性化意味着必须要有一定的逻辑,这个逻辑通常就需要通过掌握编程语言来解决。

那低码开发需要掌握什么语言呢?市面上的语言种类繁多,如C、Java、Python等,不同的语言应用的场景不同各自的能力也不同。低码开发中需要掌握的是JavaScript,它作为一种脚本语言可以很好的处理页面的各种逻辑。学习语言的话需要从基础语法学起,就像我们学习汉语是从拼音开始,学习英语是从单词开始一样。

变量

变量是用来存储值的,低码中的变量的定义有两种方法,一种是可视化的定义,在低码的控制台定义

在这里插入图片描述

通过可视化定义的变量一般用来在组件上做数据绑定,另外一种是在低码的编辑器中定义

在这里插入图片描述
在这里插入图片描述

我们在低码编辑器中定义的变量一般是和数据库进行结合使用的,这个时候就需要掌握低码的API的使用方法。

我们先看一下变量定义的语法

let name ="张三”

我们变量定义的时候使用了关键字let,计算机看到这个关键字的时候就知道你需要创建一个变量,它在内存中给你开辟了一块空间。let 之后的名字叫变量名,我们通过使用这个名字就可以获取到变量里存储的值。=表示赋值的意思,通过赋值语句来给变量填充内容。“”一对儿双引号表示我右边赋值的是字符串,字符串的值为张三

变量是有类型的,不同的类型可以接收不同的值,我们打开变量定义那可以看到具体的类型

在这里插入图片描述

分别是字符串(string)、数字(number)、布尔值(boolean)、数组(array)、对象(object)。具体使用哪种需要结合你当下的场景。

因为低码学习的人范围比较广,可能是幼儿园的园长、翡翠店的店长、健身房的老板。不管你来自什么行业,从你决定自己做一套软件,无论是内部管理也好,对外面向顾客也罢,计算机的这些基础知识是不可或缺的。无论平台宣传他的门槛有多么的低,那只是进入的门槛要自己做一点东西出来的时候它就会回归到它编程的本质上来。

注释

javascript支持注释,有多行注释和单行注释

/**
这是多行注释
**/
//这是单行注释

一般我们写低代码的时候,如果逻辑比较复杂,可以写一些注释,便于你理解这个低代码是要干什么用的。随着你接的项目越来越多,完善的注释有利于你的日常维护,因为我们当时可能知道,但是过一段时间你就很难回想起来当时为什么要这样写了。

运算符

低码中如果我们需要进行计算或者比较操作,就需要使用运算符。常见的运算符有算术运算符如+、-、*、/,对应我们数学中的加减乘除。还有一类是比较运算符,如比较两个变量是否相等==,做布尔运算的时候的取反运算符!

条件判断

我们最常使用的一种逻辑结构就是条件判断,比如我们根据一个变量的值来决定不同的执行逻辑

let age = 18
if(age>18){
  console.log("是成年人")
}else{
  console.log("是未成年人")
}

使用if关键字来告诉计算机我这段代码要进行分支判断,()圆括号里边的内容是进行判断的表达式,如果表达式计算的结果为真,那么就会执行{}大括号里边的代码,否则就执行else里边的代码。正是因为有了条件分支我们的代码才可以根据条件来执行不同的操作。

函数

我们在javascript中是通过function关键字来定义函数的,但是低码中稍有不同,他是在低码编辑器可视化的定义,要定义一个函数就需要在页面的handler里定义

在这里插入图片描述

函数的话有函数名,入参和返回值。函数名我们通过可视化的形式来进行创建,入参的话平台已经帮你创建好了,如:

/*
* 可通过 $page.handler.xxx 访问这里定义的方法
* 注意:该方法仅在所属的页面有效
* 如果需要 async-await,请修改成 export default async function() {}
*/

export default function({event, data}) {

}

其中{envent,data}就是函数的入参,只不过传入的是一个对象。返回值的话使用return关键字,可以返回一个变量

事件

js中有事件这个概念,不同的组件可以触发的事件类型不同,比如按钮组件就可以触发单击的事件,低码中的事件需要在组件中进行设置

在这里插入图片描述

我们需要响应什么类型的事件按照需要进行设置即可,比如我们比较常见的点击提交按钮需要往数据库里写入一条数据,就是选择的数据源的新增方法。

总结

我们这一篇用了一定的篇幅给小白做了一个技术扫盲,当然如果需要深入学习还是需要找一些javascript的书籍或者在线教程学习的。只有不断的打牢基础,你的低码开发才可以走的更远。

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 玩转低代码开发-循环语句

    我们上一节讲解了条件分支语句,这一节我们介绍一下循环语句。如果是初学编程的小白,在语法部分最大的难题是理解循环,把循环弄懂了,你的编程技能就前进了一大步。

    低代码布道师
  • 玩转低代码开发-条件语句

    上一篇我们用了一定的篇幅介绍了javascript的基础,本篇我们详细介绍一下javascript的语法点,本节分别介绍if语句、switch语句、三元表达式。

    低代码布道师
  • 玩转低代码开发-事件介绍

    事件是js中的一个技术概念,对比于现实中,我们看电视,当你按下遥控器的开关的时候,就触发了一个事件,遥控器里的预置好的代码就开始工作,给电视机发出指令让其开机。

    低代码布道师
  • 玩转低代码开发-函数介绍

    编程世界里有个基本的概念,叫函数,它是指将一系列的操作封装到一个集合中,给这一系列的操作起了一个名字,那么你在调用的时候可以直接使用这个名字。

    低代码布道师
  • 新人自学前端,如何快速打好前端开发基础?

    怎么样能快速的打好前端开发的基础,然后让自己的技术尽快的提高一个层次?相信这是每一个前端新人都在思考的问题。而这个问题也不止一个同学问过我,怎么样能快速学好前端...

    web前端教室
  • 微搭低代码基础开发教程

    微搭是从今年一月份开始公测,6月3日正式开始商用。期间产品经过历次迭代发布了不少功能,但是普遍让人吐槽的就是官方文档和教程更新比较慢。官方通过调研也是贴心的为大...

    低代码布道师
  • 如何自学web前端开发?精细的自学步骤是什么样的?【附勺子】

    目标人物是,一个文科的女生,27岁,非计算机专业,自学的情况下感觉太慢。也担心学习计划制定的有问题。所以想问一个具体的学习计划,包括时间点什么的。

    web前端教室
  • 微搭低代码基础开发教程-编辑器介绍

    微搭提供了低代码的编辑器,可以在编辑器中进行组件的拖拽和属性及事件的设置。在应用管理,点击应用的编辑按钮可以进入到编辑器中

    低代码布道师
  • 微搭低代码基础开发教程-数据源介绍

    我们日常开发中,经常涉及到数据库的操作,微搭提供了一套线上的文档型数据库。除了数据库外还提供了可以对数据库操作的增删改查的方法。我们常用的业务逻辑的操作都可以在...

    低代码布道师
  • JavaScript是解释型语言--V8、JIT

    编程语言是用来控制计算机的一系列指令(Instruction),它有固定的格式和词汇(不同编程语言的格式和词汇不一样),必须遵守,否则就会出错,达不到我们的目的...

    奋飛
  • jQuery 的基本使用

    jQuery的官网地址: https://jquery.com/,官网即可下载最新版本。

    清出于兰
  • DWR简介

    image.png DWR(Direct Web Remoting)是一个WEB远程调用框架.利用这个框架可以让AJAX开发变得很简单.利用DWR可以在客户...

    java达人
  • AJAX实践DWR篇

    DWR(Direct Web Remoting)是一个WEB远程调用框架.利用这个框架可以让AJAX开发变得很简单.利用DWR可以在客户端利用JavaScrip...

    源哥
  • jQuery 介绍 以及基本使用

    JavaScript库:即 library,是一个封装好的特定的集合(方法和函数)。从封装一大堆函数的角度理解库,就是在这个库中,封装了很多预先定义好的函数在...

    星辰_大海
  • 0基础一篇文学会低代码开发会员管理小程序(一)

    摘要:本文利用低代码技术,使用拖拽的方式快速开发一款会员管理系统,实现会员在线注册、充值、消费等功能。即使没有任何开发基础的小白,只要按照教程的步骤也可以掌握a...

    低代码布道师
  • 0基础一篇文学会低代码开发会员管理小程序 (二)

    我们在上一篇中实现了会员登记功能的开发,访问小程序可以看到会员登记的快捷图标,点击图标进入到登记页面,录入会员的基本信息点击提交即可保存会员的基本信息。

    低代码布道师
  • 0基础一篇文学会低代码开发会员管理小程序(三)

    我们在上一篇实现了会员的充值记录功能,期间遇到一个BUG导致了新增功能都不好使,并进行了记录。

    低代码布道师
  • 0基础一篇文学会低代码开发会员管理小程序(四)

    我们上篇介绍了会员充值记录功能的开发,通过数据源新增数组字段来保存充值记录信息,并介绍了云开发的数组操作方法。

    低代码布道师
  • 0基础一篇文学会低代码开发会员管理小程序(五)

    我们在上一篇中详细的介绍了消费功能开发,通过新增消费记录字段并新增了减少余额的自定义方法。而且我们也介绍了通过克隆页面来快速实现功能的开发。

    低代码布道师

扫码关注云+社区

领取腾讯云代金券