前端 --- JavaScript 语法基础

于 2024-05-01 18:26:57 发布
阅读量28 收藏 14
点赞数 17
分类专栏： 程序员 文章标签： 前端 javascript 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2401_84436058/article/details/138377321
版权

写到 script 标签中

在这里插入图片描述

3. 外部式

写到单独的 .js 文件中

1.js代码

alert(‘hello’);

在这里插入图片描述

3. JavaScript 基本语法

======================================================================================

3.1 注释

**单行注释: ** //

**多行注释: ** /* */

// 单行注释

/*

多行注释

多行注释

*/

3.2 输入: prompt

弹出一个输入框

在这里插入图片描述

在这里插入图片描述

3.3 输出: alert

弹出一个警告框

在这里插入图片描述

3.4 输出: console.log

在控制台打印一个日志

在这里插入图片描述

在浏览器中按 F12 ====> 找到 Console 窗口

这里就是显示日志的

3.5 其他注意事项

  1. .表示取对象中的某个属性或者方法. 可以直观理解成 “的”. console.log 就可以理解成: 使用 “控制台” 对象 “的” log方法

  2. 大小写敏感,JavaScript 对字母的大小写敏感.例如: username 和 userName是两个不同的变量

  3. 每行结尾的分号,JavaScript中并不要求必须使用分号(;)作为语句结束的标记.

  4. JS 中字符串常量可以使用单引号表示, 也可以 使用双引号表示

  5. let 和 var的区别 参考文章: 具体文章

4. JavaScript 语法概述

======================================================================================

4.1 基本用法

变量声明

let a = 20;

let b = “helloworld”;

变量的使用

let name = prompt(“请输入你的姓名”);

let age = prompt(“请输入你的年龄”);

let cl = prompt(“请输入你的班级”);

console.log(name);

console.log(age);

console.log(cl);

在这里插入图片描述

4.2 理解动态类型

Java是一种静态类型,一旦开始定义了类型，后面就无法改变了

而JavaScript是动态类型，类型可以改变。

在这里插入图片描述

4.3 基本数据类型

JS 中 内置的几种类型

| 类型 | 描述 |

| :-- | :-- |

| number | 数字. 不区分整数和小数. |

| boolean | true 真,false 假. |

| string | 字符串类型. |

| undefined | 只有唯一的值 undefin. 表示未定义的值. |

| null | 只有唯一的值null.表示空值 |

① number 数字类型

JS 中是不区分整数和浮点数,统一都使用"数字类型"来表示

数字进制表示

二进制: 以 0b 或 0B开头

八进制: 以 0 开头

十六进制: 以 0x 或 0X 开头

浮点型数据

科学计数法的表示方法,在实数后面跟随字母e或者E,后面加上一个带正号或负号的整数指数,正号可以省略.

特殊的数字值

  • Infinity: 无穷大, 大于任何数字. 表示数字已经超过了 JS 能表示的范围.

  • -Infinity: 负无穷大, 小于任何数字. 表示数字已经超过了 JS 能表示的范围.

  • NaN: (Not a Number)表示当前的结果不是一个数字.

在这里插入图片描述

② string 字符串类型

基本规则

字符串字面值需要使用引号引起来, 单引号双引号均可

包含字符串的引号必须匹配,如果字符串前面使用的是双引号,那么在字符串前面使用的是双引号,那么在字符串后面也必须使用双引号,反之都使用单引号.

转义字符

| 转义字符 | 描述 |

| :-- | :-- |

| \b | 退格 |

| \n | 换行符 |

| \t | 水平制表符,Tab空格 |

| \f | 换页 |

| ’ | 单引号 |

| " | 双引号 |

| \v | 垂直字符表 |

| \r | 回车符 |

| \ | 反斜杠 |

求长度

使用String的length属性即可

在这里插入图片描述

字符串的拼接

使用 + 进行字符串拼接

在这里插入图片描述

③ boolean 布尔类型

在这里插入图片描述

④ undefined 未定义数据类型

在这里插入图片描述

⑤ null 空值类型

在这里插入图片描述

5. 运算符

==========================================================================

5.1 算术运算符

+ 加 - 减 * 乘 / 除 % 求模

在这里插入图片描述

5.2 赋值运算符 & 复合赋值运算符

= += -= *= /= %=

在这里插入图片描述

5.3 自增自减运算符

++: 自增1 --: 自减1

在这里插入图片描述

5.4 比较运算符

< 小于

> 大于

<= 小于等于

>= 大于等于

==比较相等(会进行隐式类型转换)

!= 不等于

===比较相等(不会进行隐式类型转换)

!== (不会进行隐式类型转换)

在这里插入图片描述

5.5 逻辑运算符

  • && 与: 一假则假

  • || 或: 一真则真

  • ! 非

5.6 位运算

  • & 按位与 同为1时为1,否则为0

  • | 按位或 同为0时为1,否则为0;

  • ~ 按位取反 当是1就取0,是0就取1

  • ^ 按位异或 相同就为0,相异为1

在这里插入图片描述

5.7 移位运算

  • << 左移

  • >> 有符号右移(算术右移)

  • >>> 无符号右移(逻辑右移)

6. JavaScript 基本语句

======================================================================================

6.1 条件判断语句

if 语句

// 形式1

if (条件) {

语句

}

// 形式2

if (条件) {

语句1

} else {

语句2

}

// 形式3

if (条件1) {

语句1

} else if (条件2) {

语句2

} else if … {

语句…

} else {

语句N

}

三元表达式

是 if else 的简化写法.

条件 ? 表达式1 : 表达式2

switch 语句

switch (表达式) {

case 值1:

语句1;

break;

case 值2:

语句2:

break;

default:

语句N;

}

6.2 循环语句

while 循环

while (条件) {

循环体;

}

continue 结束当前这次循环,继续其他循环

break 结束整个循环

for 循环

for (表达式1; 表达式2; 表达式3) {

循环体

}

7. 数组

=========================================================================

7.1 数组的创建

使用 new 关键字创建

// Array 的 A 要大写

let arr = new Array();

let arr = [];

let arr2 = [1, 2, ‘haha’, false]; // 数组中保存的内容称为 “元素”

数据结构与算法

这一块在笔试、面试的代码题中考核较多，其中常考的数据结构主要有：数组、链表、队列、栈、Set、Map、哈希表等，不同数据结构有不同的方法以及储存原理，这些算是技术岗的必备知识。算法部分主要分为两大块，排序算法与一些其他算法题。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

排序算法根据考频高低主要有：快速排序、归并排序、堆排序、冒泡排序、插入排序、选择排序、希尔排序、桶排序、基数排序、Timsort这十种，这类考核点要么是算法的时间、空间复杂度、稳定度，要么是直接手写代码，故在理解算法原理的同时，对JS语言版的排序算法代码也要加强记忆。

  • 二叉树层序遍历
  • B 树的特性，B 树和 B+树的区别
  • 尾递归
  • 如何写一个大数阶乘？递归的方法会出现什么问题？
  • 把多维数组变成一维数组的方法
  • 知道的排序算法 说一下冒泡快排的原理
  • Heap 排序方法的原理？复杂度？
  • 几种常见的排序算法，手写
  • 数组的去重，尽可能写出多个方法
  • 如果有一个大的数组，都是整型，怎么找出最大的前 10 个数
  • 知道数据结构里面的常见的数据结构
  • 找出数组中第 k 大的数组出现多少次，比如数组【1，2， 4，4，3，5】第二大的数字是 4，出现两次，所以返回 2
  • 合并两个有序数组
  • 给一个数，去一个已经排好序的数组中寻找这个数的位 置（通过快速查找，二分查找）

7. 数组

=========================================================================

7.1 数组的创建

使用 new 关键字创建

// Array 的 A 要大写

let arr = new Array();

let arr = [];

let arr2 = [1, 2, ‘haha’, false]; // 数组中保存的内容称为 “元素”

数据结构与算法

这一块在笔试、面试的代码题中考核较多，其中常考的数据结构主要有：数组、链表、队列、栈、Set、Map、哈希表等，不同数据结构有不同的方法以及储存原理，这些算是技术岗的必备知识。算法部分主要分为两大块，排序算法与一些其他算法题。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

排序算法根据考频高低主要有：快速排序、归并排序、堆排序、冒泡排序、插入排序、选择排序、希尔排序、桶排序、基数排序、Timsort这十种，这类考核点要么是算法的时间、空间复杂度、稳定度，要么是直接手写代码，故在理解算法原理的同时，对JS语言版的排序算法代码也要加强记忆。

  • 二叉树层序遍历
  • B 树的特性，B 树和 B+树的区别
  • 尾递归
  • 如何写一个大数阶乘？递归的方法会出现什么问题？
  • 把多维数组变成一维数组的方法
  • 知道的排序算法 说一下冒泡快排的原理
  • Heap 排序方法的原理？复杂度？
  • 几种常见的排序算法，手写
  • 数组的去重，尽可能写出多个方法
  • 如果有一个大的数组，都是整型，怎么找出最大的前 10 个数
  • 知道数据结构里面的常见的数据结构
  • 找出数组中第 k 大的数组出现多少次，比如数组【1，2， 4，4，3，5】第二大的数字是 4，出现两次，所以返回 2
  • 合并两个有序数组
  • 给一个数，去一个已经排好序的数组中寻找这个数的位 置（通过快速查找，二分查找）

[外链图片转存中…(img-Iwn7d66L-1714559200801)]

2401_84436058
关注
专栏目录
前端 - JavaScript(基础语法)
旧时言的博客
04-24 5088
JavaScript 初识 JavaScript JavaScript 是什么 JavaScript (简称 JS) 是世界上最流行的编程语言之一 是一个脚本语言, 通过解释器运行 主要在客户端(浏览器)上运行, 现在也可以基于 node.js 在服务器端运行. JavaScript 最初只是为了完成简单的表单验证(验证数据合法性), 结果后来不小心就火了. 当前 JavaScript 已经成为了一个通用的编程语言 JavaScript 的能做的事情: 网页开发(更复杂的特效和用户交互) 网页游戏开发 服务
JavaScript
大雄专栏
09-18 1256
JavaScript 有六种数据类型。主要的类型有 number、string、object 以及 Boolean 类型,其他两种类型为 null 和 undefined。　　 String 字符串类型:字符串是用单引号或双引号来说明的。（使用单引号来输入包含引号的字符串。）如：“The cow jumped over the moon.” 　　　数值数据类型：JavaScript 支持整
JS学习笔记ZT
weixin_30352191的博客
01-06 123
每一项都是js中的小技巧，但十分的实用！ 1.document.write("");输出语句 2.JS中的注释为// 3.传统的HTML文档顺序是:document->html->(head,body) 4.一个浏览器窗口中的DOM顺序是:window->(navigator,screen,history,location,document) 5.得到表单...
前端之JavaScript
qq_774952435的博客
05-08 3558
JS基本用法
面试题练习题前端 JavaScript高级语法-字符串属性
最新发布
08-02
面试题练习题前端 JavaScript高级语法-字符串属性面试题练习题前端 JavaScript高级语法-字符串属性面试题练习题前端 JavaScript高级语法-字符串属性面试题练习题前端 JavaScript高级语法-字符串属性面试题练习题前端...
JavaScript-study:JavaScript +基础知识（ES6语法，高级语法）
05-23
学习JavaScript 我学习了Web html和CSS的基础知识，但是我不了解js，因此我记得在一个科学项目中遇到了一些麻烦； 因此，我想通过做我所学的js来制作前端的基础知识。 通过学习这个node.js类，我们将学习js的语法...
前端开发-vue-vu2,javascript,router-助你成为vue大佬
08-11
Vue.js 是一款流行的前端JavaScript框架，它以数据绑定和组件化为核心，简化了网页和单页应用（SPA）的开发。Vue.js 提供了一个简洁、高效且可扩展的开发环境，使得开发者能够专注于构建用户界面，而不必过于关注...
前端十年经验 - JavaScript基础知识大纲-思维构图.pdf
04-18
JavaScript是前端开发的核心语言，这份"前端十年经验 - JavaScript基础知识大纲"涵盖了JavaScript的各个方面，旨在帮助开发者系统地学习和理解其基础知识。以下是大纲中的主要知识点： 1. 变量和数据类型： - 基本...
前端—JavaScript基础语法
m0_62824239的博客
05-08 648
目录前置知识JavaScript书写形式行内式内嵌式外部式输出 （console.log）基础语法变量基本数据类型number: 数字boolean:布尔类型string: 字符串类型undefined：未定义数据类型null：空值类型运算符数组数组创建打印数组获取数组元素获取数组长度往数组中新增元素删除数组中的元素 对于在浏览器上执行的JS来说，可以视为三部分 1.JS核心语法 2.DOM API：浏览器提供的一组，操作页面元素的API 3.BOM API： 浏览器提供的一组，操作浏览器窗口的API 前置
前端语法知识汇总
qq_42760375的博客
11-13 291
最快的方式，带你回顾大纲
javascript的语法基础
cmyhahh的博客
05-09 179
1 变量与常量 变量是由字母，下划线 $或数字组成的，并且第一个字母必须是字母、下划线或 变量不能是系统关键字和保留字 变量的命名必须区分大小写 所有javascript变量都是由var声明 一个var可以同时定义多个变量名，用英文符号（，）隔开 例如var a=10,b=20,c=30;实际上等价于var a=10;var b=20;var c=30; 2.数据类型（值的类型） 基本数据类型只有...
JavaScript语法基础
ammmao的博客
07-02 310
文章目录注释常量和变量数据类型JavaScript对象创建JavaScript对象直接创建对象的实例使用构造器创建新的对象实例JavaScript类字符串(String)转义字符(特殊字符)字符串属性和方法字符串属性字符串方法数值型(Number对象)进制常量属性Math(算数)对象算数值算数方法数字方法数组(Array)数组属性数组方法Symbols类型运算符算数运算符赋值运算符比较运算符逻辑运...
JavaScript 语法基础
lfm1010123的博客
08-10 914
例如：下面的变量 a 就是一个 int 类型，在后面的编译阶段中，不管怎么修改 a 的值都是可以的，但当前 a 的类型始终是 int 类型，这无法改变。在 JS 中，我们可以将数组理解为一个对象，那么我们就可以利用对象对应的方法，这就和 Java 中的 ArrayList 差不多，push 就相当于 ArrayList 的 add 方法。④ JS 对象没有 “继承”，继承本质就是 “让两个对象建立关联”，或者说，是让一个对象能够重用另一个对象的属性 / 方法，JS 中使用 “原型” 机制实现类似的效果。..
JavaScript 基础语法
ZH15170975的博客
03-26 202
JavaScript 是世界上最流行的编程语言。 这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。下面就来简单介绍一下JavaScript的基础语法 一.js的书写 二.js的注释 // 表示js中的单行注释 三.变量的声明 必须是先声明后赋值，当然也可以是空变量 四.变量的命名规则 1.必须语义化（见其名知其意） var ban...
JavaScript基础语法
qq_43643867的博客
04-07 1734
书写语法 1.区分大小写：与Java一样，变量名、函数以及其他一切都是区分大小写的 2.每行结尾的分号可有可无 3.注释： 单行注释：//注释内容 多行注释：/*注释内容*/ 4.大括号表示代码块 if(count == 3){ alert(count); } 输出语句 1.使用window.alert()写入警告框 2.使用document.write()写入HTML输出 3.使用console.log()写入浏览器控制台 window.alert("helloJS");//弹
JavaScript基础语法【001】
weixin_42336546的博客
12-05 8387
JavaScript基础语法 HTML ：标记语言 JavaScript ：编程语言 序言 JavaScript发展历史（JS） 1. 1994年，网景公司(Netscape)发布了Navigator浏览器0.9版，这是世界上第一款比较成熟的网络浏览器，轰动一时。但是这是一款名副其实的浏览器--只能浏览页面，浏览器无法与用户互动,当时解决这个问题有两个办法，一个是采用现有的语言,许它们直接嵌入...
JavaScript语法基础与应用
学习和掌握JavaScript语法对于前端开发人员来说至关重要，因为它能帮助创建动态、响应式的用户体验，并且随着技术的发展，JavaScript的应用领域也在不断扩展，如Node.js使得JavaScript也能用于服务器端开发。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值