JavaScript学习第一天

你还要我怎样？

于 2022-10-29 14:43:14 发布

阅读量414

点赞数

分类专栏： JavaScript学习文章标签： javascript 学习前端

本文链接：https://blog.csdn.net/qq_46563235/article/details/127569325

版权

JavaScript学习专栏收录该内容

7 篇文章 0 订阅

订阅专栏

1、前言

（1）计算机语言

计算机语言是指人与计算机之间通讯的语言。计算机语言是人与计算机之间传递信息的媒介。计算机系统最大特征是指令通过一种语言传达给机器。为了使电子计算机进行各种工作，就需要有一套用以编写计算机程序的数字、字符和语法规则，由这些字符和语法规则组成计算机各种指令（或各种语句）。这些就是计算机能接受的语言。

（2）分类

2、JavaScript的组成部分

JavaScript主要由三个部分组成：BOM，DOM，ECMAscript

BOM（browser object model）：浏览器对象模型，有一套成熟的可以操作浏览器的API，通过BOM可以操作浏览器。比如：弹出框、浏览器跳转、获取分辨率等

DOM（document object model）：文档对象模型，有一套成熟的可以操作页面元素的API，通过DOM可以操作页面中的元素。比如：增加个div，减少个div，给div换个位置等

ECMAscript：定义了JS的语法规范，描述了语言的基础语法和数据类型

HTML相当于页面的骨架（结构）

css相当于页面的样式

js相当于页面的行为

3、JavaScript能干什么？

1、常见的网页效果【表单验证，轮播图。。。】

2、与H5配合实现游戏【水果忍者：http://www.jq22.com/demo/html5-fruit-ninia/】

3、实现应用级别的程序【http://naotu.baidu.com】

4、实现图标统计效果【https://echarts.apache.org/examples/zh/】

5、js可以实现人工智能【面部识别】

6、后端开发，app开发，桌面端开发......

4、JavaScript书写位置

和css一样，我们的js也可以有多种方式书写在页面上让其生效

（一）行内式-直接把代码书写在标签身上（不推荐）

a 标签---书写在href属性上

非 a标签---书写在行为属性上

（二）内嵌式-把代码书写在一个script标签对内

内嵌式JS代码，不需要依赖任何行为，打开页面就会执行

script标签一般放在head标签里边或者body标签里边的最后

（三）外链式-把代码书写在一个.js后缀文件内（最推荐）

外链式JS代码，不需要依赖任何行为，打开页面就会执行

使用script标签的src属性引入指定JS文件

5、JavaScript定义变量（重点）

变量：在程序运行过程中，保存一个中间值使用

变量指的是在程序中保存数据的一个容器
变量时计算机内存中存储数据的标识符，根据变量名称可以获取到内存中存储的数据
也就是说，我们向内存中存储了一个数据，然后要给这个数据起一个名字，为了是我们以后再次找到他
语法：var 变量名 = 值

一个变量只能存储一个值，当你给一个变量进行第二次赋值的时候，就会把第一次保存的值丢掉，只会保存当前的值

6、变量命名

规则：

1、变量可以由数字、字母、下划线、美元符组成

2、并且不能以数字开头

3、变量严格区分大小写

4、不能是关键字或者保留字

5、不要出现空格

规范：

1、变量名尽量有意义（语义化）

2、遵循驼峰命名规则，由多个单词组成的时候，从第二个单词开始首字母大写

3、不要使用中文

7、注释写法

8、浏览器的输出方式

9、JavaScript数据类型

（1）基本数据类型

数值类型（Number）

举例： 2，2.3，-2，-2.3，2e3的意思就是2*10^3（2×10三次方）

0x99（0x代表十六进制）

0b11（0b代表二进制）

一切数字都是数值类型（包括二进制、十进制、十六进制）

NaN（not a number），一个非数字

字符串类型（String）

被引号包括的所有内容（可以是单引号也可以是双引号）

布尔类型（Boolean）

只有两个（true或false）

未定义类型（Undefined）

就一个值undefined

空类型（Null）

值null

Symbol

（2）复杂类型

10、监测数据类型

判断数据类型

既然已经把数据分开了类型，那么我们就要知道我们存储的数据是一个什么类型
使用typeof关键字来进行判断

//第一种使用方式
var n1=100;
console.log(typeof n1);

console.log(typeof typeof n1);//输出结果是string

//第二种使用方式
var s1='abcdefg';
console.log(typeof(s1));

console.log(tepeof typeof a);//输出结果是string

11、数据类型转换-转数值

1、Number（变量）

可以把一个变量强制转换成数值类型
可以转换小数，会保留小数
可以转换布尔值
遇到不可转换的都会返回NaN

<script>

    var a="123.56"

    var b=Number(a)

    console.log(a,b)

    //输出结果是123.56 123.56

</script>

    <script>

        var a="100"

        var b=Number(a)

        console.log(typeof a,typeof b)

        //输出结果是string number

    </script>

    <script>

        var a="abc"

        var b=Number(a)

        console.log(a,b)

        //输出结果是abc NaN

        //NaN的意思是not a number

    </script>

<script>

        var a=false

        var b=Number(a)

        console.log(a,b)

        //输出结果是false 0

        //如果a=true，则输出的对应数字不是0，而是1

    </script>

    <script>

        var a=null

        var b=Number(a)

        console.log(a,b)

        //输出结果是null 0

    </script>

    <script>

        var a=undefined

        var b=Number(a)

        console.log(a,b)

        //输出结果是undefined NaN

    </script>

2、parseInt（变量）

从第一位开始检查，是数字就转换，知道一个不是数字的内容
开头就不是数字，那么直接返回NaN
不认识小数字，只能保留整数
  <script>

        var a="123abc"

        //paseInt解析整数类型

        var b=parseInt(a)

        console.log(a,b)

        //输出结果是123abc 123

    </script>
   <script>

        var a="123.56abc"

        var b=parseInt(a)

        console.log(a,b)

        //输出结果是123.56abc 123

    </script>

3、parseFloat（变量）

从第一位开始检查，是数字就转换，直到一个不是数字的内容
开头就不是数字，那么直接返回NaN
认识一次小数点
<script>

    var a="123.56abc"

    var b=parseFloat(a)

    console.log(a,b)

    //输出结果是123.56abc 123.56

</script>

4、除了加法以外的数学运算

运算符两边都是可运算数字才行
如果运算符任何一遍不是一个可运算数字，那么就会返回NaN
加法不可以用
<script>
    var a="100"
    var b=a*1   
    var c=a-0
    var d=a/1
    var f=a-1
    console.log(a,b,c,d,f)
    //输出结果100 100 100 100 99
</script>

12、数据类型转换-转字符串

1、变量.toString()

有一些数据类型不能使用toString()方法。比如undefined和null

<script>
    var a=100
    var b=String(a)
    console.log(a,b)//在控制台输出100 '100'
    console.log(typeof a,typeof b)//在控制台输出number string
</script>

<script>
    var a=true
    var b=String(a)
    console.log(a,b)//在控制台输出true 'true'
</script>

<script>
    var a=undefined
    var b=String(a)
    console.log(a,b)//在控制台输出undefined 'undefined'
</script>

<script>
    var a=null
    var b=String(a)
    console.log(a,b)//在控制台输出null 'null'
</script>

2、String变量

所有数据类型都可以
<script>
    var a=100
    var b=a.toString()
    console.log(a,b)//在控制台输出100 '100'
</script>
<script>
    var a=undefined
    var b=a.toString()
    console.log(a,b)
</script>
以上undefined不能用toString方法转换，其中null也不行

3、使用加法运算

在JS里面，+有两个含义
字符串拼接：只要+任意一边是字符串，就会进行字符串拼接
加法运算：只有+两边都是数字的时候，才会进行数学运算

13、数据类型转换-转布尔

1、Boolean（变量）

在Js中，只有''、""、0、null、undefined、NaN，这些是false
其余都是true
<script>
    var a=100
    var b=Boolean(a)
    console.log(a,b)
    //输出结果是100 true
</script>