JavaScript基础学习

最新推荐文章于 2024-08-14 09:04:24 发布

编程小栈

最新推荐文章于 2024-08-14 09:04:24 发布

阅读量221

点赞数

分类专栏：前端文章标签： javascript 学习开发语言

本文链接：https://blog.csdn.net/mmmmmcjp/article/details/131543298

版权

前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

1.1 JavaScript 是什么

布兰登·艾奇（Brendan Eich，1961年～），用10天完成 JavaScript 设计。
最初命名为 LiveScript，后来在与 Sun 合作之后将其改名为 JavaScript。
JavaScript 是世界上最流行的语言之一，是一种运行在客户端的脚本语言（Script 是脚本的意思）
脚本语言：不需要编译，运行过程中由 js 解释器( js 引擎）逐行来进行解释并执行
现在也可以基于 Node.js 技术进行服务器端编程

1.2 JavaScript 的作用

表单动态校验（密码强度检测）（ JS 产生最初的目的）
网页特效
服务端开发(Node.js)
桌面程序(Electron)
App(Cordova)
控制硬件-物联网(Ruff)
游戏开发(cocos2d-js)

1.3 HTML/CSS/JS 的关系

HTML/CSS 标记语言–描述类语言

HTML 决定网页结构和内容( 决定看到什么 )，相当于人的身体
CSS 决定网页呈现给用户的模样( 决定好不好看 )，相当于给人穿衣服、化妆

JS 脚本语言–编程类语言

实现业务逻辑和页面控制( 决定功能 )，相当于人的各种动作

1.4 浏览器执行 JS

浏览器分成两部分：渲染引擎和 JS 引擎渲染引擎：用来解析HTML与CSS，俗称内核，比如 chrome 浏览器的 blink ，老版本的 webkit
JS 引擎：也称为 JS 解释器。用来读取网页中的JavaScript代码，对其处理后运行，比如 chrome 浏览器的 V8
浏览器本身并不会执行JS代码，而是通过内置 JavaScript 引擎(解释器) 来执行 JS 代码。JS 引擎执行代码时逐行解释每一句源码（转换为机器语言），然后由计算机去执行，所以 JavaScript 语言归为脚本语言，会逐行解释执行。

1.5 JS 的组成

在这里插入图片描述
请添加图片描述

1.6 JS 有3种书写位置

分别为行内、内嵌和外部

在这里插入图片描述

1.7 JS注释

单行注释

在这里插入图片描述

多行注释

1.8 JS输入输出语句

在这里插入图片描述

1.9 JS操作变量

变量语法
在这里插入图片描述

变量语法扩展
在这里插入图片描述

1.10 JS的数据类型

在这里插入图片描述

注意事项：

在这里插入图片描述

数字型三个特殊值
在这里插入图片描述

isNaN()
在这里插入图片描述

字符串引号嵌套
在这里插入图片描述

获取检测变量的数据类型

在这里插入图片描述

数据类型转换

转换为字符串

在这里插入图片描述

转换为数字型

1.11 JS运算符

在这里插入图片描述

算术运算符

在这里插入图片描述

递增和递减运算符

在这里插入图片描述

比较运算符

在这里插入图片描述

逻辑运算符

在这里插入图片描述

赋值运算

在这里插入图片描述

运算符优先级
在这里插入图片描述

1.12 JS流程控制-分支

if else
在这里插入图片描述

三元表达式
在这里插入图片描述

switch case

在这里插入图片描述

1.13 JS流程控制-循环

for 循环

在这里插入图片描述

while 循环

do while 循环

continue break

1.14 JS操作数组

数组的概念

在这里插入图片描述

数组元素的类型

在这里插入图片描述

数组的索引

在这里插入图片描述

遍历数组

在这里插入图片描述

数组中新增元素

通过修改 length 长度新增数组元素
在这里插入图片描述

1.15 JS函数

函数概念

在这里插入图片描述

函数的使用
在这里插入图片描述

函数的参数
在这里插入图片描述

函数形参和实参个数不匹配问题

在这里插入图片描述

函数的返回值

在这里插入图片描述

arguments的使用

在这里插入图片描述

函数的两种声明方式

自定义函数方式(命名函数)

在这里插入图片描述

函数表达式方式(匿名函数）

在这里插入图片描述

1.16 JS作用域

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-YIvfdndk-1688476337404)(/Users/chenfl/Library/Application Support/typora-user-images/image-20230704170955614.png)]

全局作用域

作用于所有代码执行的环境(整个 script 标签内部)或者一个独立的 js 文件。

局部作用域（函数作用域）

作用于函数内的代码环境，就是局部作用域。因为跟函数有关系，所以也称为函数作用域。

JS 没有块级作用域

在这里插入图片描述

全局变量和局部变量的区别

在这里插入图片描述

作用域链

在这里插入图片描述

1.17 JS预解析

概念

在这里插入图片描述

变量预解析和函数预解析

在这里插入图片描述

解决函数表达式声明调用问题
在这里插入图片描述

1.18 JS对象

在这里插入图片描述

字面量创建对象

在这里插入图片描述

对象的调用

在这里插入图片描述

new Object创建对象

在这里插入图片描述

构造函数创建对象

在这里插入图片描述

遍历对象属性
在这里插入图片描述

总结
在这里插入图片描述

1.19 JS内置对象

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-GmTyMMLA-1688476337405)(/Users/chenfl/Library/Application Support/typora-user-images/image-20230704173514286.png)]

学习一个内置对象的使用，只要学会其常用成员的使用即可，我们可以通过查文档学习，可以通过MDN/W3C来查询。Mozilla 开发者网络（MDN）提供了有关开放网络技术（Open Web）的信息，包括 HTML、CSS 和万维网及 HTML5 应用的 API。MDN: https://developer.mozilla.org/zh-CN/

Math对象

在这里插入图片描述

Date对象

Date 对象和 Math 对象不一样，他是一个构造函数，所以我们需要实例化后才能使用

在这里插入图片描述

数组对象

创建数组对象的两种方式

1- 字面量方式，2- new Array()

检测是否为数组
在这里插入图片描述

添加删除数组元素的方法
在这里插入图片描述

数组索引方法
在这里插入图片描述

数组连接截取
在这里插入图片描述

字符串对象

基本包装类型

在这里插入图片描述

字符串的不可变
在这里插入图片描述

replace() 方法用于在字符串中用一些字符替换另一些字符。

split()方法用于切分字符串，它可以将字符串切分为数组。在切分完毕之后，返回的是一个新数组。

toUpperCase() //转换大写

toLowerCase() //转换小写

1.20 JS简单类型与复杂类型

在这里插入图片描述

编程小栈

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
JavaScript基础学习

学习一个内置对象的使用，只要学会其常用成员的使用即可，我们可以通过查文档学习，可以通过MDN/W3C来查询。浏览器本身并不会执行JS代码，而是通过内置 JavaScript 引擎(解释器) 来执行 JS 代码。JS 引擎执行代码时逐行解释每一句源码（转换为机器语言），然后由计算机去执行，所以 JavaScript 语言归为脚本语言，会逐行解释执行。浏览器分成两部分：渲染引擎和 JS 引擎渲染引擎：用来解析HTML与CSS，俗称内核，比如 chrome 浏览器的 blink ，老版本的 webkit。
复制链接

扫一扫