python web开发学习笔记一：javascript基础
一.认识js：
能进入到软件所实习是我的最大的收获，也是我的荣幸，我相信努力付出一定能够换回收获。
项目最先开始的是接触到web前端的一些内容，我们需要利用flask搭建应该有的框架。我有一些python和java基础，学起js来觉得不是很费劲，js是一种轻量级的脚本语言，专门应用于前端开发；它是是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。js比较年轻，一直处于比较火热的状态，它是在最早1995年由Netscape公司在浏览器上首次设计实现，它的语法风格接近于java。
在这里说下自己的学习总结同时也对新手是一种简单的入门引领吧。
二.js基本语法：
绝大部分的主流ide以及编辑工具都支持js的编写，推荐notepad++；我目前因为python依赖比较多，所以使用pycharm来进行相关的开发工作。首先我们使用js语言可以在谷歌浏览器的控制台操作，或者嵌入到html模板内部。
1.js的导入：
js导入到html中有2种方式：一个是通过<script src="filepath/file.js">的方式，一个是直接在html内部利用<script>进行编写。我惊讶的发现在一个js文件只要在另外一个js文件前面引用，后面导入的js文件可以直接使用前面导入的js文件内部的全局变量。
2.js的一般性规则：
在js中依旧和其他弱类型语言一样，他需要对变量进行申明，使用的唯一的申明方法就是var，在js中一切皆变量，包括函数与对象。在一个语句块前后均需要{。。。}的标识，以及每一句话或者是语句块的结束都需要以 ； 结尾，js解释器会自动的帮你标示“；”，但是我们为了代码的可读性，最好使用 ； 结尾；在js中的变量函数的命名采用小驼峰法，类的命名采用大驼峰法，类的实例化采用new关键字；this关键字等价于python中的self。
3.数据类型：
js中的数据类型包括：字符串、Number、布尔、比较运算符、null和undefined、数组、对象；
字符串：就是一串字符，可以使用单引号或者双引号；
Number：就是数值型数据；布尔：包括true以及false；比较运算符：JavaScript允许对任意数据类型做比较，在比较等于有三个等号，三个等号比较的时候js不会帮你转换数据的类型进行比较，而两个等号在进行比较的时候js会自动帮助你进行数据类型的转换；
null和undefined：很多面试都会问到这个的区别，null表示一个“空”的值，它和0以及空字符串''不同，0是一个数值，''表示长度为0的字符串，而null表示“空”，null等于是python里的None，null表示未定义的值，而undifined表示未定义的值,undefined仅在判断函数或者变量是否存在的情况下有用，一般在使用中都是使用null；
数组：类似于python列表以及java的数组，存储容器，有很多的方法进行操作，可以直接对数组查询length属性，也可以直接通过索引改变数组的值，使用slice（）函数可以直接对数组进行切片操作，push（）函数可以向数组末尾添加一个或者多个元素，pop则是删除末尾的元素，数组的拼接不适合直接相加，只能用concat（）函数，这里和python有些许区别，当然还有join（‘--’）方法将数组的每一个元素进行拼接并返回一个新的字符串，数组内的元素可以是对象也可以是数组；最后是对象：类似于python中的字典，在进行json文件操作的时候非常有用，可以直接将获取到的json文件内容进行有关的操作，包括修改创建键值对，实际上JavaScript对象的所有属性都是字符串，不过属性对应的值可以是任意数据类型，通过in操作符可以判断是否对象中包含了相应的键，可以直接通过.key来进行访问或者 [‘key’] 来进行访问。
map以及set：Map是一组键值对的结构，具有极快的查找速度。他可以使用数字或者其他数据类型来作为键，使用set或者二维数组来作为构造map工具；set类似于python中的集合，有着去重的效果，需要提供一个以为数组作为输入构造一个set，add（）来进行添加。
4.js中的各种结构：
1.选择结构：
也就是if () { ... } else if { ... } else{...}结构，最好是写上{}，增加可读性，else后面的小括号可以不写条件；其中之一的条件被满足之后之后的不再进行判断。JavaScript把null、undefined、0、NaN和空字符串''视为false，其他值一概视为true。
2.循环结构：
JavaScript的循环有两种，一种是for循环，通过初始条件、结束条件和递增条件来循环执行语句块：这个地方和java的就是一模一样了；使用for...in循环可以遍历出数组的下标以及对象的键；一种是while循环只有一个条件，条件满足就可以一直循环；
3.函数：
函数式编程的重要性就不多说了，在js中函数也是十分重要的。函数的定义方式使用function关键字来进行定义，大概类似于：function abs(x) {...}这样的方式，函数体内部遇到return会立即停止，若没有return则继续进行下去。函数可以作为一个变量来进行相关的参数传递操作；第二种定义函数的方式如下：var abc = function(){...}右边的部分是一个匿名函数，类似于pyhton中的lambda函数，临时创建临时使用之后立刻放弃，这2种方式创建函数式等价的。同样的，参数传递进去也要讲究顺序性。关键字arguments，它只在函数内部起作用，利用arguments，你可以获得调用者传入的所有参数。也就是说，即使函数不定义任何参数，还是可以拿到参数的值。它类似于一个参数列表。arguments[id]来对参数进行访问。
4.变量作用域：
用var申明的变量实际上是有作用域的，如果一个变量在函数体内部申明，则该变量的作用域为整个函数体，在函数体外不可引用该变量。变量的作用范围值得我们去深究，通常我们需要好几个全局变量，甚至拿到其他的js文件中去使用。优先级依然是由内到外，内部嵌套函数的变量永远优先执行。在写法上，可以使用一个var将多个变量赋值换行。使用let关键字可以申明一个更小的块级作用变量，用在判断选择结构内部，const则是常量的意思。
5.可能会很实用的内置函数：
map()、filter()、sort()，对应数组调用map函数可以将内部元素依次的用map传入的函数来进行操作，并返回新的处理后的数组。filter过滤函数，用法类似于map，但是是保留符合要求的元素删除不要的元素。排序函数就不多说了。
6.js的面向对象：
class关键字创建类，然后调用new构造对象，class+大驼峰命名，类似class Student(name) {...}，同样的，var xiaoming = new Student('小明');可以构造类的实例化，这和其他语言是相同的----继承类的属性以及方法，类似于在python类中的self写法，这里也是要求使用this关键字，诸如this.name=**,this.age=**等等；
7.浏览器对象：
JavaScript可以获取浏览器提供的很多对象，并进行操作。window对象表示浏览器窗口，包括innerWidth以及innerHeight属性，对应的是浏览器的内部宽度以及高度，内部宽高是指除去菜单栏，工具栏，边框等之后的网页净宽高。还有outerWidth以及outerHeight对应的是外部宽高。同样的location对象显示的是当前页面的URL信息。最重要的还有document对象，html在浏览器中表现为DOM的树形结构，document是整个树形结构的根节点，用document对象提供的getElementById()以及getElementsByTagName()可以按id以及tag名字查找一组节点。
顺便认识一下cookie，是指某些网站为了辨别用户身份，进行session跟踪而存储在本地终端的数据。Cookie 是由 Web 服务器保存在用户浏览器（客户端）上的小文本文件，它可以包含有关用户的信息。cookie由服务器端生成，是一系列的键值对，当一个用户登陆成功之后，服务器会发送一个cookie给浏览器存储进文件目录，当浏览器访问该网站时，就会在http协议下的请求头上附上该cookie。服务器可以根据cookie区分用户。
5.js高阶：
1.DOM操作：更新DOM节点，通过innerHTML来进行直接来修改节点文本以及内部HTML子树。innerText是更新内部的文本信息，不包含html代码。对DOM节点对象调用style属性来修改css，如DOM.style.color = 'red'，等；
2.插入DOM节点：通常用jquery更加的方便，这里使用appendChild()方法，可以将新的元素对象放置于节点的最后一个子元素后。insertBefore(a,b)可以将节点插入到对应节点之前，a插入父节点下的子节点b前。
3.children属性所对应节点的所有子节点，children[i]表示的是第i-1个子节点。同样的parentElement属性代表的是父节点。
4.另外还有关于input以及form的操作，value属性可以用来获取元素的值以及赋值；这里有有个地方就是对于上传文件的操作，‘type=file’ 的情况下，这个input框对应的value值就是上传文件的完整路径名。对于文件的读取，js也有自己的特性，可以使用FileReader实例来进行操作，在onload下执行相应的函数。
