前端培训-初级阶段(13)-ECMAScript(语法,变量 ,值 , 类型,运算符 , 语句)

简介: 前端最基础的就是 HTML+CSS+Javascript。掌握了这三门技术就算入门,但也仅仅是入门,现在前端开发的定义已经远远不止这些。前端小课堂(HTML/CSS/JS),本着提升技术水平,打牢基础知识的中心思想,我们开课啦(每周四)。该文为前端培训-初级阶段(13、18) (介绍了 ECMAScript 历史,ES6 常用点)的补充内容。本文介绍ECMAScript基础知识。

bVbqEW6.webp.jpg

我们要讲什么


  1. 语法


  1. 变量


  1. 类型、值


  1. 运算符


  1. 语句


语法


如果是熟悉任意一门高级编程语言的开发者会发现 ECMAScript 的语法很容易掌握,因为差距不是很大,其中也有借鉴的地方。尤其是与 Java 有一些关键的语法特性相同,名字都是蹭热度


  1. 区分大小写varVar 是不同的变量


  1. 变量是弱类型的 这点和其他语言有很大区别,(前端也有TS)。


  1. 结尾分号不是必须的 但是比如(()=>console.log('ln'))(),有时候容易出现异常错误


window.a
;(v=>console.log(v))(1)
window.a
(v=>console.log(v))(1)


1.注释


  1. 单行注释以双斜杠开头(//
  2. 多行注释以单斜杠和星号开头(/*),以星号和单斜杠结尾(*/


2.括号表示代码块 不会生成块级作用域(老版本)


变量


  1. 命名规则
    第一个字符必须是字母、下划线(_)或美元符号($),余下的字符可以是下划线、美元符号或任何字母或数字字符


  1. 声明方式
  1. var 声明变量,变量提升
  2. let 会生成块级作用域
  3. const 生成一个不可以改变的常量


类型、值


  1. 原始类型存储在栈(stack)中的简单数据段,也就是说,它们的值直接存储在变量访问的位置。原型类型有 Undefined、Null、Boolean、Number 和 String 。由于这些原始类型占据的空间是固定的,所以可将他们存储在较小的内存区域中(栈)。这样存储便于迅速查寻变量的值。可以使用typeof来判断是什么类型


bVbqES9.webp.jpg


注释:您也许会问,为什么 typeof 运算符对于 null 值会返回 "Object"。这实际上是 JavaScript 最初实现中的一个错误,然后被 ECMAScript 沿用了。现在,null 被认为是对象的占位符,从而解释了这一矛盾,但从技术上来说,它仍然是原始值

a.Undefined 当声明的变量未初始化时,或者对象中不存在的值。认为是一个暂未赋值的值。


b.Null 对象占位符,认为是一个空的值。


c.Boolean 布尔类型 true 和 false。


d.Number 可以表示 32 位的整数,还可以表示 64 位的浮点数。对于浮点字面量的有趣之处在于,用它进行计算前,真正存储的是字符串。


用 64 位 IEEE 754 形式存储浮点值,这意味着十进制值最多可以有 17 个十进制位。17 位之后的值将被裁去,从而造成一些小的数学误差。

e.String 字符串类型


  1. 引用类型


存储在堆(heap)中的对象,也就是说,存储在变量处的值是一个指针(point),指向存储对象的内存处。


该类型指 Object ,当然还有 Array,Array 也是对象的一种。


运算符


运算符 优先级 例子 描述
. [] () 1 Math.random();arr[0];(a+1)*b 字段访问、数组下标、函数调用以及表达式分组
++ -- + - ~ ! delete new typeof void 2 ++a;a++;+a;-a;~a;!a; 一元运算符
* / % 3 ++a;a++;+a;-a;~a;!a; 二元运算符,算数运算符,乘、除、余
+ - 4 a+b;a+'';a-b 二元运算符,算数运算符,加减、字符串连接
<< >> >>> 5 2>>1 二元运算符,位运算符,位移,无符号位移
< <= > >= instanceof 6 2>1 二元运算符,比较运算符
== != === !== 7 2==1 二元运算符,比较运算符
& 8 2&1 二元运算符,位运算符,按位与
^ 9 2^1 二元运算符,位运算符,按位异或
1 10 211 二元运算符,位运算符,按位或
&& 11 2&&1 二元运算符,逻辑运算符,短路
11 12 2111 二元运算符,逻辑运算符,短路
?: 13 `` 三元运算符,条件运算符
= oP= 14 `` 二元运算符,赋值运算符
, 15 `` 逗号,多重


语句


语句 功能 示例 描述
if 逻辑判断 if(a % 2 == 0){console.log('偶数')} 用来判断条件成立执行代码
if(){}else{}
if(){}else if(){}else{}
switch(){case:break;default:break;} 类似于if但是是单值匹配 找到对应状态执行代码
for(初值;判断;步长){} 循环遍历 for(var = 1;i < 10; i++) console.log(i) 完成多个相同功能的任务
while(判断){} 循环遍历 完成多个相同功能的任务
do{}while(); 循环遍历 完成多个相同功能的任务


相关文章
|
2月前
|
存储 前端开发 JavaScript
前端基础(二)_JavaScript变量、JavaScript标识符、JavaScript获取元素、JavaScript的鼠标事件
本文介绍了JavaScript变量的声明和使用、标识符的命名规则、如何获取和操作HTML元素,以及JavaScript的鼠标事件处理,通过示例代码展示了这些基础知识点在实际开发中的应用。
43 2
前端基础(二)_JavaScript变量、JavaScript标识符、JavaScript获取元素、JavaScript的鼠标事件
|
2月前
|
前端开发 JavaScript
前端基础(五)_运算符(算术运算符、赋值运算符、比较运算符、逻辑运算符、三目运算符、运算符优先级和结合性、数据类型的隐式转换)
本文介绍了JavaScript中的算术运算符、赋值运算符、比较运算符、逻辑运算符、三目运算符、运算符优先级和结合性以及数据类型的隐式转换。
36 3
|
2月前
|
存储 前端开发 JavaScript
前端基础(十一)_函数声明及调用、函数的形参与实参、arguments参数、函数的参数类型、函数中的问题
本文介绍了JavaScript中函数的声明及调用、形参与实参的概念、arguments对象的使用、函数参数的类型以及函数中this的作用。通过示例代码详细解释了函数如何接收参数、如何处理参数个数不匹配的情况,以及函数在不同上下文中this的指向。
23 1
|
2月前
|
前端开发 程序员
【前端web入门第二天】01 html语法实现列表与表格_合并单元格
本文介绍了HTML中的列表与表格的使用方法。列表包括无序列表(`&lt;ul&gt;`嵌套`&lt;li&gt;`)、有序列表(`&lt;ol&gt;`嵌套`&lt;li&gt;`)和定义列表(`&lt;dl&gt;`嵌套`&lt;dt&gt;`和`&lt;dd&gt;`)。
60 19
|
2月前
|
前端开发 程序员 C++
【前端web入门第一天】01 开发环境、HTML基本语法文本标签
本文档详细介绍了HTML文本标签的基础知识。首先指导如何准备开发环境,包括安装VSCode及常用插件;接着全面解析HTML的基本结构与标签语法,涵盖从基本骨架搭建到注释的使用,以及标题、段落、换行和平行线、文本格式化等标签的具体应用,适合初学者循序渐进地掌握HTML。
|
2月前
|
前端开发 小程序 开发者
小程序的前端 display 有什么类型?
【9月更文挑战第4天】小程序的前端 display 有什么类型?
65 4
|
3月前
|
缓存 前端开发 Java
【前端学java】java基础巩固复习巩固语法练习-工具类的封装(14)
【8月更文挑战第10天】java基础巩固,工具类的封装
26 1
【前端学java】java基础巩固复习巩固语法练习-工具类的封装(14)
|
3月前
|
存储 前端开发 JavaScript
【前端学JAVA】有手就会!10min快速入门java的基础语法(2)
【8月更文挑战第8天】10min快速入门java的基础语法
41 2
【前端学JAVA】有手就会!10min快速入门java的基础语法(2)
|
2月前
|
前端开发 小程序 开发者
小程序的前端 display 有什么类型?
【9月更文挑战第1天】小程序的前端 display 有什么类型?
49 2
|
3月前
|
JavaScript 前端开发 开发者
前端掌握 ts 的类型体操
【8月更文挑战第23天】前端掌握 ts 的类型体操
42 4