JavaScript基础-ES6

目录

前言：

java Script的组成：

java Script的书写位置：

java Script的注释：

java Script的输入输出语法：

java Script的变量：

java Script 获取字符串长度：

java Script的数据类型：

1、数字型：

2、字符串型：

3、布尔型(boolean):

4、未定义类型(undefined):

5、空类型(null):

java Script 模板字串：

java Script的数据类型检测：

java Script的数据类型转换：

1.转换成字符串型：

2.转换成数字型：

 java Script的算数运算符：

java Script的赋值运算符：

 java Script的一元运算符：

java Script的比较运算符：

java Script的逻辑运算符：

java Script的运算符优先级：

java Script 表达式和语句：

java Script 三大流程控制语句：

java Script 分支语句：

1.if分支语句：

2.三元运算符：

很重要的案例:补0

简单案例：计算器

java Script 循环语句：

1. while循环:

简单案例：ATM机

2. do-while循环:

3. for循环:

4. 循环退出 break和continue：

java Script 数组：

1、声明语法

2、取值语法

3、遍历数组

案例1：求和与平均值

案例2：求最大值和最小值

4、操作数组

案例：数组筛选

综合案例：排序算法

综合案例：柱状图

java Script 函数：

1、为什么我们需要函数：

2、函数的声明：

小案例：（理解函数）

3、函数传参

4、函数的返回值：

5、函数的作用域

匿名函数：

立即执行函数：

综合案例：秒转换成 时分秒

java Script 对象：

1、什么是对象      

2、对象的声明

3、对象的操作：

4、遍历对象

综合案例（1）：

5、内置对象

拓展：（学过计算机基础 和Javase的应该都了解）

---

前言：

本人之前 学过c语言Javase等基础语言，虽然js和c和java没有直接的关系,但是他们的基础语法还是有很多相似之处，所以这一次笔记没有做的很详细。

java Script的组成：

在学习java Script之前我们要明白java Script的组成部分有哪些：

首先java Script分为2大部分 ECMAScript 和 webAPIs

然后webAPIs又分为  DOM(页面文档对象模型)和BOD（浏览器对象模型）

我在java Script基础这里主要是做的关于ECMAScript的基础语法笔记

java Script的书写位置：

之前我们都学过css的书写位置，其实js的书写位置和css差不错也分为三个位置分别是：

内联js、内部js、外部js。

注意：和之前css不一样 js的书写位置都要写在里面，而且要写在最下面，即的上面

 注意：在我们js当中换行可以作为结束符所以我们在一行代码的最后可以不加  “ ; ” ,当然如果不加都不加，如果加了就全都加上。

java Script的注释：

分为单行和多行注释:

java Script的输入输出语法：

输入语法：

注意:prompt输入和表单输入的都是字符串型

输出语法：

java Script的变量：

        理解变量：变量是计算机存储数据的容器，

        我们在定义变量的时候可以用var 和let ，var和let的区别：

        1.var可以先使用在说明

        2.var可以重复声明  

        3.var变量提升、全局变量、没有块级作用

        4.let有块级作用域

        现在我们统一用let 。

 

  变量的命名:

1.变量名区分大小写（y 和 Y 是不同的变量）

2.变量名包含字母、数字、美元符号（$）和下划线，但第一个字符不允许是数字，不允许包含空格和其他标点符号；变量也能以 $ 和 _ 符号开头（不过不推荐这么做）

3.禁止使用JavaScript关键词、保留字命名

4.当变量名是由两个或多个单词构成时，可以采用驼峰命名法。
驼峰命名有两种形式：
小驼峰式命名法（lower camel case）：第一个单字以小写字母开始；第二个单字的首字母大写，例如：firstName、lastName。
大驼峰式命名法（upper camel case）：每一个单字的首字母都采用大写字母，例如：FirstName、LastName、CamelCase，也被称为Pascal命名法。

5.帕斯卡命名法
即变量名由两个或多个单词构成时，单词之间用连接号（-）、下划线（_）连接。如first-name或者说first_name。、

6.const用于声明常量，一旦定义就不能修改，常量声明后需同时赋值，并且常量通常以大写字母命名。

7遵循见名知意原则。

java Script 获取字符串长度：

java Script的数据类型：

1.基本数据类型：

                        number 数字型

                        string 字符串型

                        boolean 布尔型

                        undefined未定义型

                        null空类型

2.引用数据类型：

                        object 对象

                        function 函数

                        array 数组

1、数字型：

即是我们生活中学习到的数字，可以是小数，整数，正数，负数。

2、字符串型：

通过单引号、双引号、反引号包裹的数据都叫字符串。         

注意事项:
1.无论单引号或是双引号必须成对使用.
2.单引号/双引号可以互相嵌套,但是不以自己嵌套自己(口诀:外双内单，或者外单内双)
3.必要时可以使用转义符\,输出单引号或双引号.

3、布尔型(boolean):

表示肯定或者否定时在计算机中对应的是布尔数据类型

他又2个值true和false，true（表示肯定）表示真，false（表示否定）表示假

4、未定义类型(undefined):

未定义是比较特殊的类型，只有一一个值undefined。

什么情况出现未定义类型?

只声明变量，不赋值的情况下，变量的默认值为undefined,一般很少[直接]为某个变量赋值为undefined。

工作中的使用场景:
我们开发中经常声明一个变量,等待传送过来的数据。
如果我们不知道这个数据是否传递过来，此时我们可以通过检测这个变量是不是undefined,就判断用户是否
有数据传递过来。

5、空类型(null):

null 表示值为空

null和undefined区别：

1.undefined表示没有赋值

2.null表示赋值了，但是内容为空

开发中使用场景：

将来有个变量里面存放一个对象，但是还没有创建好，可以先给一个null

 总结：

java Script 模板字串：

作用：

拼接字符串和变量

符号：

反引号（``）

内容拼接时候，用${}包裹住变量

java Script的数据类型检测：

1.通过typeof 来检测

2.通过浏览器控制台字体颜色来判断

        

 

java Script的数据类型转换：

 常用的数据了类型转换

            1.转化成字符串型

            2.转换成数字型

            3.转换成布尔型

1.转换成字符串型：

2.转换成数字型：

 java Script的算数运算符：

java Script的赋值运算符：

 java Script的一元运算符：

目标：能够使用一元运算符做自增运算

前置自增和后置自增的区别：（自减同理）

java Script的比较运算符：

作用：比较数据的大小是否相等

 注意点:

字符串比较，是比较的字符串对应的ASCII码

                从左往右依次比较

                如果第一位一样在比较第二位，以此类推

                应用比较少，了解即可

NaN不等于任何值，包括他本身

尽量不要比较小数，因为又精度问题

不同类型之间会发生隐式转换    

java Script的逻辑运算符：

逻辑运算符的短路：

java Script的运算符优先级：

java Script 表达式和语句：

表达式：表达式式一组代码的集合，java script解释器会将其计算出一个结果

语句：js整句或命令，js语句式以为分号结束（可以省略）

         比如 if语句 for循环语句  while循环语句....

区别：

        表达式计算出一个值，但是语句用来自行以使某件事情发生（作什么事）

        表达式：3+4

        语句 ： alert() 弹出对话框

        实际情况，也可以把表达式理解为语句，因为他们是在计算结果，也是做事

java Script 三大流程控制语句：

java Script 分支语句：

分支语句包含：

                if分支 语句

                三元运算符

                switch 语句

1.if分支语句：

                if语句有三种：单分支，双分支，多分支

                

 

 

2.三元运算符：

 一般用来取值

很重要的案例:补0

3.switch语句：

目的:利用switch语句执行满足条件的语句；

简单案例：计算器

java Script 循环语句：

1. while循环:

         注意事项：

                        1. 变量的起始值

                        2. 终止变量（没有终止条件，循环会一直进行下去，造成死循环）

                        3. 变量变化量（用自增或者自减）

简单案例：ATM机

2. do-while循环:

3. for循环:

主要工作场景：遍历数组

 for 循环嵌套：

练手小案例：（5个）

 

 

 

 经典案例：九九乘法表

优化版：

4. 循环退出 break和continue：

continue:退出本次循环，继续下一次循环

break：跳出所在循环

java Script 数组：

数组（array）：数组是一种可以按顺序保存的数据类型

1、声明语法

        数组是按照顺序保存，所以每个数据都有着自己的编号

        计算机中的编号是从0开始，所以数组的编号以0开始（例如： 数据1 的编号就为0）

        在数组中，数据的编号也叫索引或下标

        数组可以存储任意类型的数据

2、取值语法

 例如：

3、遍历数组

案例1：求和与平均值

案例2：求最大值和最小值

最大值：（最小值类似）

4、操作数组

操作数组：即数组的 增、删、改、查

 查，改：

增：

数组.push() 方法将一个或者多个元素添加到末尾，并且返回该数组的新长度

语法：

例子：

 

数组.unshift() 方法将一个或者多个元素添加到开头，并且返回该数组的新长度 

语法：

例子：

案例：数组筛选

 删：

数组.pop() 方法从数组中删除最后一个元素，并且返回该元素的值

语法：

例子：

数组.shift() 方法从数组中删除第一个元素，并且返回该元素的值

语法：

例子：

数组.splice() 方法删除指定元素值

语法：

 例子：

综合案例：排序算法

将数组数组中元素按照从小到大排列：

综合案例：柱状图

要求：实现输入多少就呈现多少的柱状图

 练手小案例：（3个）

 

java Script 函数：

1、为什么我们需要函数：

2、函数的声明：

语法：

 函数的命名规范：

        1. 和变量命名基本一致

        2.尽量用小驼峰命名法

        3.前缀应该为动词

        4.命名建议：常用动词约定

例：

小案例：（理解函数）

3、函数传参

声明语法：

         参数列表（形参）：

                        传入数据列表

                        声明这个函数需要传入几个数据

                        多个数据用逗号隔开

调用语法：

 这里的传递参数是实参数

理解形参数和实参：

注意点：

如果形参过多 会自动填上 undefined

如果实参过多 多余的参数会被忽略掉

小技巧：

小案例-求和

4、函数的返回值：

概念：当我们调用函数的时候，函数会返回给我们一个结果；

用return返回数据：

当函数需要返回数据时，用return关键字；

语法：

使用方法：

 

 注意点：

小案例：

 返回多个值：（利用数组）

5、函数的作用域

作用域概述：

 变量的作用域：

注意点：

       1、 如果函数内部或者块级作用域，变量没有声明，直接赋值，也可以当作全局变量，但是强烈不推荐

        2、函数内部的形参，可以看作局部变量

作用域链：（同css选择器优先级类似）

   就近原则

匿名函数：

函数的定义：

匿名函数：

将匿名函数赋值给一个变量，并且通过变量名进行调用 我们将这个称为函数表达式

语法：

 调用：

传参使用方法和具名函数一样。

立即执行函数：

使用场景：避免全局变量之间的污染

语法：

例：

方式一：

 方式二：

注意：多个立即执行函数之间需要  ；隔开  不然会报错！！！

综合案例：秒转换成 时分秒

java Script 对象：

1、什么是对象      

2、对象的声明

语法：

对象由属性和方法组成：

属性：信息或者叫做特征。（名词） 如： 人的 身高、体重

方法：功能或者叫做行为。（动词） 如： 人打代码、唱、跳、rap、篮球

属性：

属性访问:

 方法的定义：

 方法的访问：

3、对象的操作：

4、遍历对象

        遍历对象：

        对象没有像数组一样的length属性，所以无法确定长度。

        对象里面是无序的键值对，没有规律，不想数组里里面由规律的下标。

综合案例（1）：

5、内置对象

内置对象是什么：

                JavaScript内部提供的对象，包含各种属性和方法给开发者使用

内置对象Math：

Math里面有很多方法具体的可以去MDN Web Docs看：https://developer.mozilla.org/zh-CN/

生成任意范围随机数：

小案例：生成随机数

小案例：生成随机人名

 小案例：猜数字

拓展：（学过计算机基础 和Javase的应该都了解）

术语：

基本数据类型和引用是数据类型的存储方式：

堆和栈： 

这里是本人学习Web前端的一些笔记，可以供大家一起学习和交流！！！