JavaScript

137 阅读6分钟

JavaScript

一.认识javascript

JavaScript作用是和网页进行交互的

回顾网页的组成

HTML 网页的内容结构

CSS 网页的视觉体验

JavaScript 网页的交互处理

JavaScript的作用

HTML CSS JavaScript代码都需要依赖于浏览器

JavaScript的作用是给浏览器指令(命令),负责和浏览器进行沟通

JavaScript是一门编程语言

编程语言就是计算机语言

  • c
  • c++
  • c#
  • JavaScript
  • java
  • Python
  • PHP
  • GO
  • typescript
  • objective-c
  • swift
  • kotlin
  • dart

二.JavaScript的历史

诞生背景;1995网景公司 Eich,Scheme,发明JavaScript

微软公司:JScript

1996年网景公司想ECMA(欧洲计算机制造商协会)提交了提案:ECMA指定这门语言的标准

1997年ECMA指定标准:ECMAScript

JavaScript知识ECMAScript一种实现:

JavaScript:JavaScript+DOM+BOM

按照运行方式的不同:

  • 编译性语言:C语言 int(print(123))->编译成二进制代码->执行
  • 解释性语言:JS语言(alert(123))

高级语言按照其运行的方式又可以分为:

  • 编译型语言:代码需要先编译,在运行
  • 解释型语言:一行行读取,一行行执行.读取一行,解释一行,执行一行

代表性语言

  • 编译型语言:C/C++/Objective-C/Swift
  • 解释型语言:python/JavaScript/MATLAB

静态与动态

  • 静态类型的语言:在代码执行之前,可以确定一个变量(标识符),准确的类型,并且之后不允许修改
  • 动态类型的语言:javascript不确定一个变量的类型,所以可以再代码执行过程中,动态修改

三.JavaScript

  • 解释型语言
  • 动态类型语言:可以再执行过程中动态改变变量的类型,非常灵活,但是不安全

目前前段转向typescript,强大之处在于提供了类型检测

javascript目前可以做那些工作

1.网页的交互 2.服务端开发 node.js 3.命令行工具 node.js 4.桌面程序,VSCode使用TypeScript开发的 5.APP(React Native) 6.游戏开发(cocos2d-js) 7.小程序开发:HTML(WXML)+CSS(WXSS)+JavaScript

四.JavaScript编写位置

注意事项

1.script标签不能写成单标签:

  • 在外联式引用js文件时,script标签中不可以写JavaScript代码,并且script标签不能写成单标签
  • 即不能写成<script src="index.js"/>

2.省略type属性:

  • 在以前的代码中,<script>标签中会使用type="text/javascript".
  • 现在可不写这个代码了,因为JavaScript是所有现代浏览器以及HTML5中的默认脚本语言

3.加载顺序:

  • 作为HTML文档内容的一部分,JavaScript默认遵循HTML文档的加载顺序,即自下而上的加载顺序
  • 推荐奖JavaScript代码和编写位置放在body子元素的最后一行

4.JavaScript代码严格区分大小写

  • HTML元素和CSS属性不区分大小写,但是在JavaScript中严格区分大小写

五.JavaScript注释使用

六.和浏览器交互方式

方式一 : 弹出弹窗显示内容

alert函数:接收一个参数

方式二 : 在控制台打印(使用最多)

console.log(内容1,内容2)

方式三 : 将内容输入到界面显示

通过document.write(写入的内容)

方式四 : 接受用户输入的内容

七. 如何定义变量

为什么需要变量

为了省事 因为懒 麻烦

不设置变量会导致大面积的更改名称

变量的命名格式

变量的声明:在JavaScript中声明一个变量使用var关键字

变量的赋值:使用=给变量进行赋值

变量的命名规则和规范

变量命名规则:必须遵守

  • 第一个字符必须是一个字母,下划线_ 或者一个美元符号$
  • 其他字符可以使字母,下划线,美元符号或者数字
  • 不能使用关键字和保留字命名

变量命名规范:建议遵守

  • 多个单词使用驼峰标识
  • 尽量做到见明知意 不要使用拼音
  • 赋值=两边都加上一个空格
  • 一条语句结束后加上分号

变量的练习

八.基础的数据类型

  • 数值型(数字型) (number)
  • 字符串类型 (string)
  • 布尔型 (boolean)
  • 空类型 (null)
  • 未定义型(undefined)

数字型

数字表示范围:

  • 最大值:Number.MIN_VALUE,这个值为:5e-324
  • 最小值:Number.MAX_VALUE,这个值为:1.7976931348623157e+308

NaN

即非数值(Not a Number)是一个特殊的数值,JS中当对数值进行计算时没有结果返回,则返回NaN.

isNaN

用于判断是否不是一个数字.不是数字返回true,是数字返回false

字符串类型 string

用于表示一段文字

字符串的表示可以使用单引号也可以使用双引号

转义字符:

获取字符串的长度:length属性

Undefined和Null类型

  • Undefined类型只有一个值:undefined
    • 在使用var声明变量但未对其加以初始化时,这个变量的值就是undefined
    • typeof对没有初始化和没有生命的变量都会返回undefined
  • Null类型也是只有一个值:null
    • 通常当一个对象(Object类型)不再使用时,可以赋值为null
  • Null和Undefined的关系:
    • undefined值实际上是由null值衍生出来的,所以如果比较undefined和full是否相等,会返回true
    • 但是转化为数字式,undefined为NaN,null为0

变量存储的本质

内存的分类:栈空间和堆空间

九.数据类型的转换

转换成数字类型一

在开发中,我们可能需要类型之间相互转换,比如将一个字符串"123"转成数字123

其他类型转成数值类型的时候,存在有两种可能的值:

  • 转换成功,获取到对应的数字
  • 转换失败,结果为NaN

将其他类型转成数字类型的方法:

Number(any)函数:将任意类型转成数字

转换成数字类型二

  • pareseInt(string,radix)函数:将字符串转换成整数类型,radix表示基数,这里可以理解成进制
    • 如果第一个字符是数字或运算符号,name就开始解析,直到遇到非数字字符,停止解析并得到解析结果
    • 如果第一个字符是非数字切非运算符号,则不解析并得到结果NaN
  • pareseFloat(string)函数:将字符串转换成浮点类型(小数类型)
    • 如果第一个字符是数字或运算符号,那么久开始解析,直到遇到非数字字符,定制解析并得到解析结果;
    • 如果第一字符是费熟悉且飞元素安抚好,则不解析并得到结果NaN

转换成字符串类型

  • 方式一:调用toString()方法
  • 方式二:String(内容)
  • 注意:
    • 1.toString()方法只能将数值类型和布尔类型转换成字符串类型,不能将Undefined和Null类型转成字符串类型;
    • 2.String()函数能将所有基本类型转成字符串类型;
  • 方式三:字符串拼接

转换成布尔类型

通常使用Boolean()函数将其他类型转成布尔类型:

转换成false的五种特殊值:""(空字符串) 0(包括0和-0) undefined null NaN

  • 如果某个值为""(空字符串) 0(包括0和-0) undefined null NaN时,name这个值转换成布尔类型之后的值为false
  • 否则,其值为true(记住五种特殊值)