javaScript基础语法知识点总结

 一.
1.JS简介
        历史：布兰登·艾奇 1995完成设计
1.1javascript （是什么？）
        是一种运行在客户端（浏览器）的编程语言，实现人机交互
        脚本语言：不需要编译，运行过程中由js解释器逐行来进行解释
2.作用（做什么？）
        网页特效（监听用户的一些行为让网页作出对应的反馈）
        表单验证（针对表单数据的合法性进行判断）
        数据交互（获取后台的数据，渲染到前端）
        服务端编程（node.js）
        桌面程序（Electron）
        App（cordova）
        控制硬件
        游戏开发
3.javaScript的组成（有什么？）
        ECMAScript：规定了js基础语法核心知识（例如：变量、分支语句、循环语句、对象等）
        Web APIs：DOM 操作文档，比如对页面元素进行移动、大小、添加删除等操作
         BOM 操作浏览器，比如页面弹窗，检测窗口宽度，存储数据浏览器等等
4.js的特征：
          1.解释型
    运行环境：浏览器、nodejs
  2.弱数据类型语言
  3.顺序执行
  4.既可以作为前端语言、服务器端语言，取决于运行环境（浏览器、操纵系统 nodejs）
（不会可以看MDN）
5.浏览器执行js
  渲染引擎：用来解析HTML与CSS，俗称内核
  js引擎：也称为js解释器，用来读取网页中的js代码，对齐处理后运行
1.2JavaScipt 书写位置
1.内部javascript
直接写在html文件里，用哪个script标签包住
规范：script标签写在上面

2.外部javascript
代码写在以js结尾的文件里
语法：通过script标签，引入到html页面中

3.内联javascript
注意事项：书写位置尽量写到文档末尾前面
外部js标签中间不要写代码，否则会被忽略

1.3javascript注释
1.单行注释
符号：//   作用：右行这一行代码会被忽略   ctrl + /
2.块注释
符号：/* */  作用： 在/*和 */之间所有内容都会被忽略  shift + alt +A
    1.特殊的语法、技术
    2.业务的说明
1.4javasript结束符
1.结束符
代表语句结束
英文分号；
可写可不写
换行符会被识别成结束符，所以一个完整的语句，不要手动换行
为了风格统一，要写结束符就每句都写，要么每句都不写
1.5 javaScript输入和输出
1.输出语法
document.write（‘要输出的内容’）
向body内输出内容
如果输出内容写的是标签，也会被解析成网页元素
alert（‘要输出的内容’）
页面弹出警告对话框
console.log（‘控制台打印’）
控制台输出语法，程序员调试使用 
2.输入语法
prompt（‘输入文字’）
显示一个对话框，对话框中包含一条文字信息，用来提示用哪个户输入文字
1.6字面量
 在计算机科学中，字面量（literal）是在计算机中描述 事/物
1.7三种BOM弹框样式
 alert prompt confirm
2.变量
2.1变量的概念
变量是计算机存储数据的容器
2.2变量的基本使用
1.变量赋值：
也可以声明变量的时候同时给变量初始化
//声明了一个age变量，同时里面存放了18这个数据
let age = 18
2.声明变量
要想使用变量，首先需要创建变量（专业说法：声明变量 ）
let 变量名
声明变量有两部分构成：声明关键字、变量名（标识）let即为关键字，所为关键字是系统提供专门用来声明（定义）变量的词语
let age （age也叫标识符）
先定义变量 后再赋值
通过变量名来获取变量里面的数据
3.同时定义和声明多个变量
let name=‘’， age=， use
console.log（name，age）
4.交换变量的值
分析：核心思路：使用一个 临时变量 用来做中间存储
步骤：
    1.声明一个临时变量temp
    2.把num1的值赋值给temp
    3.把num2的值赋值给num1
    4.把temp的值赋值给num2
5.注意事项
变量先定义在使用，如果先使用会报错
 let 不允许重复声明相同的变量
6.let和var的区别
var 可以先使用 得到的是undefined（undefined 有变量，但没有数据）
var 不可以先使用 不允许重复声明相同的变量
2.3变量的本质
内存：计算机中存储数据的地方，相当于一个空间
变量：是程序在内存中申请的一块用来存放数据的小空间
2.4变量命名规则与规范
1.规则：
    不能用关键字（关键字：有特殊含义的字符，js内置的一些英语词汇，例如；let、var、if、for）等
    只能用下划线、字母、数字、$组成，且数字不能开头
    字母严格区分大小写
2.规范
    起名要有意义
    变量全小写
    由下划线开头的变量的系统级别的变量
    函数名称是首字母小写的驼峰 小驼峰
    构造函数 大驼峰
    遵守小驼峰命名法（第一个字母首字母小写，后面每个单词首字母大写例如：userName）
3.数据类型
3.1数据类型
 为什么要给数据分类
    1.更加充分和高效的利用内存
    2.也更加方便程序员的使用数据     
 JS 数据类型整体分为两大类：
    基本数据类型（number 数字型 string 字符串型 boolean 布尔值 undefined 未定义型 null 空类型）
    引用数组类型（object 对象；function函数；array数组）
  检测类型用typeof （console.log（typeof 变量名）） 
  数字型nummber
    js中的正数、负数、小数等 统称为 数字类型
    js是弱数据类型，变量到底属于那种类型，只有赋值之后我们才能确认
    最大值Number.MAX_VALUE 最小值Number.MIN_VALUE
    无穷大Infinity  无穷小-Infinity
    NaN非数值
    判断函数：判断是否是非数值isNaN（isNaN 这个方法用来判断非数字 并返回一个值 是数字返回false 不是返回ture）
    判断当前：判断是否是有效范围内的值isFinite
  字符串型string
     通过单引号‘’双引号“”反引号``包裹的数据都叫字符串，单引号和双引号没有本质上的区别，推荐使用单引号
    字符串是由若干字符组成，这些字符的数量就是字符串的长度，通过字符串的length属性可以获取整个字符串的长度
    注意事项：（无论单引号或是双引号必须成对使用；单引号/双引号是可以相互嵌套，但是不以自己嵌套自己；必要时可以使用转义符\，输出单引号或双引号 ）
    拼接字符串
    字符串 + 任何类型 = 拼接之后的新字符串
    1.console.log（‘大大大’+ 变量名 + ‘dadw’）
    2.console.log（`我今年${age}岁了`）用反引号包住 ，中间用${}包裹变量名
    字符字面量（\n换行   \t缩进  \b空格  \r回车）
  布尔型和undefined、null
    boolean：布尔型：判断（true false）
    undefined：未定义，只定义变量但没有数据的时候
    null：空类型，typeof得到的结果是object，表示这个变量未来存在对象
4.数据类型的转换
4.1为什么需要类型转换
javascript是弱数据类型，js也不知道变量到底属于那种数据类型，只有赋值了才清楚。（使用表单、prompt获取过来的数据默认是字符串类型的，此时就不能直接简单的进行加法运算）
4.2隐式转换
  某些运算符被执行时，系统内部自动将数据类型进行转换，这种转换称为  隐式转换
    规则：
    + 号两边只要有一个是字符串，都会把另外一个转成字符串
    除了+以外的算数运算符 比如- * /等都会把数据转成数字类型
··    缺点：
    转换类型不明确，考经验才能总结
    小技巧：
    +号作为正号解析可以转换成Number（加号可以放在字符串类型前例如：+‘str’；+prompt）
    比较符也可转换为number
4.3显式转换
 编写程序时过度依靠系统内部的隐式转换是不严谨的，因为隐式转换规律并不清晰，大多是靠经验总结的规律。为了避免因隐式转换带来的问题，通常根据逻辑需要对数据进行显示转换
 转换为数字型：
 1.Number（数据）
    转成数字类型
    如果字符串内容理由非数字，转换失败时结果为NaN，即不是一个数字
    NaN也是number类型的数据，代表非数字
 2.parseInt（数据）
    只保留整数
 3.parseFloat（数据）
    可以保留小数
  转换为字符型：
  1.String（数据）
  2.变量.toString（进制）（默认十进制）
  转换为boolean
  Boolean（）
    代表空、否定的值会被转换为false，如（0，NaN, null，undefined；其余的值都会被转换为true）
  ！！ 也能转换为boolean

二.流程控制
1.运算符
  1.1算数运算符
    数学运算符也叫算数运算符，主要包括加、减、乘、除、取余（求模）
    +：求和 -：求减 *：求积   /:求商   %：取模（取余数 开发中经常作为某个数字是否被删除）
    同时使用多个运算符编写程序时，会按着某种顺序先后执行，我们称为优先级。js中 优先级越高越先被执行，优先级相同时以书从左向右执行
    乘、除、取余优先级相同
    加、减优先级相同
    乘除、取余优先级大于加减
    使用（）可以提升优先级
    
  1.2赋值运算符
    赋值运算符：对变量进行赋值的运算符
    +=  -=  *=  /= %=
  1.3 一元运算符
    自增++
    作用：让变量的值+1
    自减：符号：--
    作用：让变量的值 -1
    使用场景：经常用于计数来使用。
    前置自增和后置自增独立使用时而二者并没有区别
    一般开发中我们都是独立使用
    后面i++后置自增会使用相对较多
    只需要一个表达式就可以运算的运算符叫一元运算符
    前后置自增的区别
    前置：先自增后运算
    后置：先运算后自增
    自减同理
    面试题（let i= 1 console.log（i++ + ++i + i））
   1.4比较运算符
    作用：比较两个数据大小、是否相等
    比较运算符：
    >: 左边是否大于右边
    <: 左边是否小于右边
    >=：左边是否大于或等于右边
    <=：左边是否小于或等于右边
    ==：左右两边是否相等，只判断数值
    ===：左右两边是否类型和值都相等
    ！==：左右两边是否不全等
    比较结构为boolean类型，即只会得到true或false，推荐使用全等
    细节：
    1.字符串比较，是比较的字符对应的ASCLL码
        从左往右比较
        如果第一位一样再比较第二位，以此类推
    2.NaN不等于任何值，包括他本身
    3.尽量不要比较小数，因为小数有精度问题
    4.不同类型之间比较会发生隐式转换
        最终把数据隐式转换成number类型再比较
        所以开发中，如果进行准确的比较我们更喜欢===或者！==
    

    1.5逻辑运算符
    逻辑运算符用来解决多重条件判断
    逻辑运算符：
    &&    逻辑与    并且  符号两边都为true结果才为true 一假则假
    ||        逻辑或    或者  符号两边有一个true就为true 一真则真
    ！      逻辑非     去反  true变为false false变为true 真变假 假变真
    逻辑运算符里的短路
    短路：只存在于&& 和 || 中，当满足一定条件会让右边代码不执行
    && 左边为false就短路
    ||     左边为true就短路
    原因：通过左边能得到整个式子的结果，因此没必要在判断右边
    运算结果：无论&&还是||，运算结果都是被执行的表达式值，一般用在变量赋值 
    运算符优先级：
    小括号>一元运算符（++ -- ！>算术运算符（*/%+-）>关系运算符（>  >=  <  <+）>相等运算符（==  ！=  ===  ！==）>逻辑运算符(先&&后||)>赋值运算符（+= -= *=）>逗号运算符（，）

2.语句
   2.1表达式和语句
        表达式：
    表达式是一组代码的集合，js解释器会将其计算出一个结果
        语句：
    js整句或语句，js语句是以分号结束（可以省略）
   2.2分支语句
         1.程序三大流程控制语句
    以前我们写的代码，写几句就从上往下执行几句，这种叫顺序结构
    有的时候要根据条件选择执行代码，这种就叫分支语句
    某段代码被重复执行，就叫循环语句
          2.分支语句
    分支语句可以让我们有选择的执行代码
    分支语句包含：if分支语句； 三元运算符； switch语句
        1.if语句
           发语句有三种使用：单分支、双分支、多分支
           单分支语句使用语法：
                 if（条件）{满足条件要执行的代码}
        括号内的条件为true时，进入大括号里执行代码
        小括号内的结果若不是布尔类型，会发生隐式转换转为布尔类型

            双分支语句语法：
        if（条件）{满足条件要执行的代码}else{不满足条件执行的代码}
            多分支语句：
        if（条件以）{代码一} else if （条件二）{代码二} else{代码三}
        先判断条件1，若满足条件就执行代码1，其他不执行；若不满足则向下判断条件2，满足条件2执行代码2，其他不执行；若依然不满足继续往下判断，依次类推；若以上条件都不满足，执行else里的代码
            2.三元运算符
        其实是比if双分支更简单的写法，有时候也叫做三元表达式
        符号：？ 与 ：配合使用
        条件 ？ 代码1 ：代码2
        一般用来取值
           3.switch语句
        switch（数据/变量名）{case1：代码1 break default：代码nbreak}
        找到跟小括号里数据全等的case值，并执行里面对应的代码
        若没有全等 === 的则执行default里的代码
        1.switch case 语句一般用来等值判断，不适合区间判断
        2.switch case 一般需要配合break关键字使用 没有break会造成穿透
    3.循环语句
          1.while循环语法
             while（循环条件）{要重复执行的代码（循环体）}
             循环：重复执行某段代码，而while：在...期间
             while注意事项：
        循环的本质就是以某个变量为起始值，然后不断产生变化量，慢慢靠近终止条件的过程
        循环三要素：1.变量起始值；2.终止条件（没有终止条件，循环会一直执行，造成死循环）；3.变量变化量（用自增或者自减）
          2.for循环语法
        for (声明记录循环次数的变量；循环条件；变化值）{循环体}
        for 循环的最大价值：循环数组
          3.for循环和while循环有什么区别
        当明确了循环次数的时候推荐使用for循环
        当不明确循环的次数的时候推荐使用while循环
           4.循环结束
        continue：结束本次循环，继续下次循环
        break：跳出 所在的循环 
            5.循环嵌套

三.
1.数组 
数组(Array)是一种可以按顺序保存数据的数据类型
   1.1声明语法：let 数组名 = [数据1，数据2....数据n]
    数组是按顺序保存，所以每个数据都有自己的编号
    计算机中的编号从0开始
    在数组中，数据的编号也叫索引或下标
    数组可以存储任意类型的数据
    1.2取值语法 数组名[下标]
    通过下标取数据
    取出来是什么类型的，就根据这种类型特点来访问
    1.3一些术语
    元素：数组中保存的每个数据都叫数组元素
    下标：数组中数据的标号
    长度：数组中数据的个数，通过数组的length属性获得
    1.4遍历数组
    用循环把数组中每个元素都访问到，一般用for循环遍历
    语法：for (let i =0 ; i<数组名.length;i++) {数组名[i]}
 2.操作数组
    数组本质是数据集合，操作数据无非就是增删改查语法
    1.查询数组数据
        数组[下标]
    2.重新赋值
        数组[下标] = 新值
    3.数组添加新的数据
        数组.push（）方法将一个或多个元素添加到数组的末尾，并返回该数组的新长度
        数组.unshift(新增的内容)方法将一个或多个元素添加到数组的开头，并返回该数组的新长度
    4.删除数组中的数据
        数组.pop()方法从数组中删除最后一个元素，并返回该元素的值
        数组.shift()方法从数组中删除第一个元素，并返回该元素的值 
        数组.splice()方法 删除指定元素/也可以添加指定元素
               数组.splice(start,deleteCount)
            strat 起始位置：指定修改的开始位置（从0计数）
            deleteCount；表示要移除的数组元素的个数；可选的。如果省略则默认从指定的起始位置删除到最后
            数组.splice（1,2,3）第一是从第几个开始，第二个是删除几个，第三个是添加
               使用场景：1.随机抽奖，中奖的用户就需要从数组里面删除，不允许重复抽奖； 2.点击删除按钮，相关数据会从商品数据中删除         

四。函数
  1.1为什么需要函数
    函数：function，是被设计为执行特定任务的代码块
    说明：函数可以把具有相同或相似逻辑的代码“包裹”起来通过函数调佣执行这些被包裹的代码逻辑，这么做的目的是精简代码方便复用
  1.2函数的使用
    函数声明语法：function 函数名（ ） {函数体}
    函数命名规范：1.和变量命名规则基本一致2.尽量使用小驼峰命名3.前缀应为动词
    函数调用，这些函数体内的代码块逻辑会被执行   函数名（）
  1.3函数传参
    若函数完成功能需要调用者传入数据，那么就需要用有参数的函数
    这样可以极大提高函数灵活性
    参数列表：传入数据；声明这个函数需要传入几个数据
    多个数据用逗号隔开
    形参：声明函数时写在函数名右边小括号里的叫形参（形式上的参数）
    实参：调用函数时写在函数名右边小括号里的叫实参（实际上的参数）
    形参可以理解为是在这个函数声明的变量，实参可以理解为是这个变量赋值
    开发中尽量保持形参和实参个数一致
    如果实参和形参个数不对应，js不报错， 得到undefined
    如果形参和实参顺序不对应，js不报错，导致数据没有意义
    形参个数：函数名称.length
    实参个数：arguments.length
  1.4 函数返回值
    概念：当调用某个函数，这个函数会返回一个结果；就是有返回值得函数
    细节：1.在函数体中使用return关键字能将内部的执行结果交给函数外部使用；2.函数内部只能出现1次return ，并且return 后面代码不会被执行，所以return 后面的数据不要换行写；3.return会立即结束当前函数 4.函数可以没有return，这种情况函数默认返回值为undefined
    为什么要让函数有返回值：1.函数执行后得到结果，结果是调用者想要拿到的；2.对执行结果的拓展性更高，可以让其他程序使用这个结果
  1.5作用域
    概述：通常来说，一段代码中所用到的名字并不总是有效的和可用的，而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性，增强了程序的可靠性，减少了名字冲突。
    全局作用域：全局有效 作用于所有代码执行的环境（整个 script标签内部）或者一个独立的技术文件
    全局变量：函数外部let的变量 全局变量在任何区域都可以访问和修改
    局部作用域：局部有效 作用于函数内的代码环境，就是局部作用域。因为跟函数有关系，所以也称为函数作用域
    局部变量：函数内部let的变量 局部变量只能在当前函数内部访问和修改
    块级作用域 {}有效 块级作用域由{}包括，if语句和for语句里面的{}等
    块级变量：{}内部的let变量  let定义的变量，只能在块作用域里访问，不能跨块访问，也不能跨函数访问
    变量作用域的坑：如果函数内部或者块级作用域内部，变量没有声明，直接赋值，也当全局变量看，但是强烈不推荐，但是有一种情况，函数内部的形参可以看做是局部变量
  1.6匿名函数
    将匿名函数赋值给一个变量，并且通过变量名称进行调用 我们将这个称为函数表达式
    语法：let fn = function(){}
    调用： fn（）
    使用场景 web Api里
  1.7立即执行函数
    语法：1.;(function(){})()    2.;(function(){}())
    不需调用，立即执行；多个立即执行函数要用分号隔开，不然会报错

五.对象
  1.1对象是什么
    对象（object）：js里的一种数据
    对象是一种无序的数据集合
    用来描述某个事物
  1.2对象的特点
    无序数据的集合
    可以详细的描述某个事物
  2.1对象的使用
    1.对象的写法：let 对象名 = {}
    2.对象有属性和方法组成
             属性：信息或叫特征（名词）
             方法：功能或叫行为（动词）
             let 对象名 = {属性名：属性值，
            方法名：函数}
    3.属性
      数据描述性的信息称为属性
        属性都是成对出现的，包括属性名和值，他们之间使用英文冒号分割
        多个属性之间使用英文逗号分割
        属性就是依附在对象上的变量（外面是变量，对象内饰属性）
        属性名可以使用“”或‘’，一般情况省略，除非名称遇到特殊符号如空格、中横线等
    4.获取属性方法
       声明对象，并添加了若干属性后，可以使用.或[]获得对象中属性对应的值，称之为访问（简单理解就是获得对象里面的属性值）
    5.对象中的方法
       数据行为性的信息称为方法
        1.方法是由方法名和函数两部分构成，他们之间用冒号分割
        2.多个属性之间使用英文逗号分割
        3.方法是依附在对象中的函数
        4.方法名可以使用“”或‘’，一般情况省略，除非名称遇到特殊符号如空格、中横线等
         方法的访问：对象名.方法名
   3操作对象
     对象本质是无序的数据集合，操作数据无非就是增、删、改、查 语法：
    1.查询对象
        对象.属性 或者 对象[‘属性’]   对象.方法
    2.重新赋值
        对象.属性 = 值    
        对象.方法 = function（）{}
        对象[''] = 值
    3.对象添加新的数据
        对象名.新属性名 = 新值
        对象名['新属性名'] = 新值
    4.删除
        delete 对象名.属性名
        delete 对象名[‘属性名’]
   4.遍历对象
    对象没有像数组一样的length属性，所以无法确定长度
    对象里面是无序的键值对，没有规律，不像数组里面有规律的下标
    语法：for （let k in 对象名）{
        console.log(k)  //打印属性名        
        console.log(对象名[k])   //打印属性值
        （点语法在这里不可以，会得到undefined，因为点语法后面跟的必须是对象的属性名，这个对象没有k这个属性名）
        }
   5.内置对象
    1.内置对象是什么？
       js内部提供的对象，包含各种属性和方法给开发者调用
    2.内置对象Math
        1.random（）随机数：0-1，不包含1的随机小数
        2.ceil：向上取值
        3.max：找最大数
        4.min：找最小数
        5.pow：幂运算
        6.abs：绝对值
        7.round：四舍五入
        （生成N-M之间的随机数 （Math.floor(Math.random() * (M - N + 1)) + N））

   6.术语解释
    关键字  在js中有特殊意义的词汇   let、var、function、if、else、seitch、case、break
    保留字 在目前的js中没有意义，但未来可能会具有特殊意义的词汇  int short long char
    标识    变量名、函数名的另一种叫法   
    表达式    能产生值得代码，一般配合运算符出现   
    语句  一句代码也称之为一条语句，一般按用途还会分类：输出语句、声明语句、分支语句
  7.基本数据类型和引用数据类型
    简单类型又叫做基本数据类型或者值类型，复杂类型又叫做引用类型
    值类型：简单数据类型/基本数据类型，在存储是变量中存储的是值本身，因此叫做值类型（string、number、boolean、undefined、null）
    引用数据类型：复杂数据类型，在存储时变量中存储的仅仅是地址（引用），因此叫做数据类型（通过new关键字创建的对象（系统对象、自定义对象），如Object、Array、Date）
    堆栈空间分配区别
        1.栈（操作系统）：由操作系统自动分配释放存放函数的参数值、局部变量的值等（简单数据类型存放到栈里面）
        2.堆（操作系统）：存储复杂数据类型（对象），一般由程序员分配释放，若程序员不释放，由垃圾回收机制回收（引用数据类型放到堆里面）