一名前端工程师的自学之路！Js篇（03-14更新）

xss : 跨站脚本攻击 （Cross Site Scripting）

为了不和层叠样式表（Cascading Style Sheet）的缩写混淆，故将跨站脚本攻击缩写为XSS

什么是脚本攻击 ?

思考问题：网站的注册功能脚本攻击 ： 就是在表单中输入一些特殊含义代码的数据 比如: <a href="#">xxx</a>解决办法1 ： 在表单中用Js 正则验证问题来了 ： 网站可以通过右键点击浏览器的查看源代码，获取网站的表单数据（包括后台路径）；这是，网站的使用者能将表单的数据粘贴到本地的另一个页面，运行这个页面，在表单中输入一些特殊含义的代码，也可以实现脚本攻击。所以前段的Js验证 并没有从根本解决脚本攻击。解决办法2 ：在服务器上做验证服务器如何验证-核心思想：去掉表单中输入的标签，保留标签的内容<?phpheader("content-type:text/html;charset=utf-8");$name = $_POST["uname"];//取消接收到的数据中所含有的标签//echo strip_tags($name);//strip_tags php中去掉标签的方法//通过验证去掉标签$reg = '/<.+>(.*)</.+>/';if(preg_match($reg,$name,$arr)){$name = $arr[1];}echo $name;?>原理图

对象

万事万物皆对象对象是一个整体，对外提供一些功能一切具有属性和方法的事物一切具有本质特征的行为的物质人：属性 --- 人的本质特征 ： 身高 体重 性别 年龄方法 --- 人的具有的行为： 吃 喝 走路 学习...汽车：属性 --- 颜色 型号 品牌 价格方法 --- 形式 启动属性 ---》 静态方法 ---》 动态document对象： 属性没括号 方法 有括号；数据类型：所有的基本数据类型都没有属性和方法所有的对象数据类型都有属性和方法函数和方法的区别 ： 方法属于函数，函数包含方法。类的概念 : 类是具有相同本质特征的一类事物的总称。Js中的类 --- 构造函数类和对象的区别：类是对象的抽象 对象是类的实例（类是对象的抽象化，对象是类的具象化）现有对象，根据一类对象的共同特征抽象出类的概念 。

面向对象 （oop） Object Oriented Programming

面向对象编程: 是一种编程思想面向过程：面向对象语言： php java .net c++面向过程语言： c语言实例：一条公路畅100000米，汽车行驶的速度 100km/h 问走稳这段路需要多久面向过程 ：h = 长度 / 速度面向对象 ：公路：--属性：长度人： --速度； 1000m/h结果 = 公路.length / 人.speed

创建对象

第一种方法：var obj = new Object();obj.name = "zhangsan";定义对象属性obj.age = 12 ； 定义对象属性obj.walk = function (){//定义对象方法alert（"行走方法"）}第二种方法：var obj = {"name":"xm","age":"12","walk":function(){console . log ("行走方法")}}；严格的json对象只有属性没有方法上述方式创建同类对象是，会产生重复的代码。

工厂模式（设计模式的一种）

优点：工厂模式可以解决同类对象创建时 重复代码 写多次的问题缺点：不能确定某一个对象属于哪一类；一般一个对象通过 new 关键字构造出来的，而工厂模式只是一个很普通的函数工厂模式 --- 模具function createObj（）{//备料 --- 创建对象var obj = new Object（）;//加工 --- 为对象添加属性和方法obj.name = name；obj.tel = tel；obj.say = function（）{return "hello"}//出厂 --- 将创建的对象返回return obj；}

构造函数

构造函数中的属性 叫做 实例属性构造函数中的方法 叫做 实例方法为了和普通函数区分，一般构造函数的命名规范是: 大驼峰 GaoJunJie基本上所有的对象都是通过构造函数创建出来的构造函数中的this 指向的是 构造函数执行时创建出来的那个对象。定义一个构造函数function Animla(name,age,food){this.name = name;this.age = age;this.food = food;this.eat = function(){return this.name + "正在吃" + this.food;}}var animal = new Animla("xiaohu",1.5,"骨头");alert(animal.eat());优点 ： 解决了工厂模式中存在的缺点，可以通过构造函数方式，确定某个对象属于哪一个类缺点 ： 同类对象创建时，相同方法会重复创建。空间不共享

原型 prototype

写在原型函数中的属性叫做 ：原型属性写在原型函数中的方法叫做 ：原型方法定义一个原型函数function Student(){}Student.prototype.name = "xm";Student.prototype.age = 18;Student.prototype.study=function(){return "一定要好好学习";}var stu = new Student();alert(stu.name);alert(stu.study())优点 : 解决了相同对象创建时方法重建的问题。缺点 : 多个对象的属性值相同，不能更改。

混合

将属性写成构造函数的实例属性将方法写成构造函数的原型方法定义一个混合函数function Go(name,age){this.name = name;this.age = age;}Go.prototype.study=function(){return "啦啦啦"}var sss = new Go("Jay",18);alert(sss.name);alert(sss.study());

我的小程序，自律更自由，如果你也喜欢锻炼的话在这里寻找你的小伙伴吧。

一只喜欢锻炼的程序猿，嘿嘿。

你都看到这了，不点个关注就过分了哈～