开始web开发的学习的一点碎碎念

刚刚开始web开发的学习，之前一直做点涉及到c、c++的东西。接触web，一切从头再来。随便写点学习的历程。

 

NO1.曾经被问到过这个问题：forward与 rederict 的区别？（查询的一下资料，我觉得这算是比较完整的答案了。）

1.从地址栏显示来说
forward是服务器请求资源,服务器直接访问目标地址的URL,把那个URL的响应内容读取过来,然后把这些内容再发给浏览器.浏览器根本不知道服务器发
送的内容从哪里来的,所以它的地址栏还是原来的地址.
redirect是服务端根据逻辑,发送一个状态码,告诉浏览器重新去请求那个地址.所以地址栏显示的是新的URL.

2.从数据共享来说
forward:转发页面和转发到的页面可以共享request里面的数据.
redirect:不能共享数据.

3.从运用地方来说
forward:一般用于用户登陆的时候,根据角色转发到相应的模块.
redirect:一般用于用户注销登陆时返回主页面和跳转到其它的网站等.

4.从效率来说
forward:高.
redirect:低.

 

No2.在看MVC中关于controller时候，对get、post有了点小小的疑问（初学者，小白一枚）。

Form中的get和post方法，在数据传输过程中分别对应了HTTP协议中的GET和POST方法。二者主要区别如下： 

1、Get是用来从服务器上获得数据，而Post是用来向服务器上传递数据。 

2、 Get将表单中数据的按照variable=value的形式，添加到action所指向的URL后面，并且两者使用“?”连接，而各个变量之间使用 “&”连接；
Post是将表单中的数据放在form的数据体中，按照变量和值相对应的方式，传递到action所指向URL。

3、 Get是不安全的，因为在传输过程，数据被放在请求的URL中，而如今现有的很多服务器、代理服务器或者用户代理都会将请求URL记录到日志文件
中，然后 放在某个地方，这样就可能会有一些隐私的信息被第三方看到。另外，用户也可以在浏览器上直接看到提交的数据，一些系统内部消息将会
一同显示在用户面前。 Post的所有操作对用户来说都是不可见的。

4、Get传输的数据量小，这主要是因为受URL长度限制；而Post可以传输大量的数据，所以在上传文件只能使用Post。

5、Get限制Form表单的数据集的值必须为ASCII字符；而Post支持整个ISO10646字符集。

6、Get是Form的默认方法。

7、method为get时action页面后边带的参数列表会被忽视

NO3.在使用VS2012 express for web 学习JavaScript的时候遇到了断点失效的问题。

解决方案：

 <script type="text/javascript">
        debugger;
        function SuperType() {
            this.colors = ["red", "blue", "green"];
        }

        function SubType() {
        }

        //inherit from SuperType
        SubType.prototype = new SuperType();
        debugger;//开始调试
        var instance1 = new SubType();
        instance1.colors.push("black");
        alert(instance1.colors);    //"red,blue,green,black"

        var instance2 = new SubType();
        alert(instance2.colors);    //"red,blue,green,black"


    </script>

 

在需要打断点的地方的上一行写上“debugger”。貌似这个功能在IE上可以用（我的版本是8，其他的不确定是否 

好用），chrome不好用。

ps：debugger是用来代替断点功能的。因此，使用了这个指令，无需再下断点。VS2012在遇到它时，就会像该行有断点一样地中断。因此，调试完后
，记得删除这个标志。

 

NO4.JavaScript面向对象的思想

1.创建对象时的问题

1）constructor方式可以在处理变量方面比较在行，但是其在处理方法上就不咋样了，不同对象的同名函数竟然是不相等的。

function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.sayName = new Function(“alert(this.name)”); //logical equivalent
}
alert(person1.sayName == person2.sayName); //false

2）Prototype方式遇到reference value的时候就有点怪异了。当一个实例修改了其中的reference类型的变量时，会影响到其他的实例的访问。

function Person(){
}
Person.prototype = {
constructor: Person,
name : “Nicholas”,
age : 29,
job : “Software Engineer”,
friends : [“Shelby”, “Court”],
sayName : function () {
alert(this.name);
}
};
var person1 = new Person();
var person2 = new Person();
person1.friends.push(“Van”);
alert(person1.friends); //”Shelby,Court,Van”
alert(person2.friends); //”Shelby,Court,Van”
alert(person1.friends === person2.friends); //true

3）所以使用两者的结合比较给力可以模拟出面向对象的思想，使constructor的方式声明变量，使用Prototype的方式声明方法。

function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
Available for
download on
Wrox.com
this.friends = [“Shelby”, “Court”];
}
Person.prototype = {
constructor: Person,
sayName : function () {
alert(this.name);
}
};
var person1 = new Person(“Nicholas”, 29, “Software Engineer”);
var person2 = new Person(“Greg”, 27, “Doctor”);
person1.friends.push(“Van”);
alert(person1.friends); //”Shelby,Court,Van”
alert(person2.friends); //”Shelby,Court”
alert(person1.friends === person2.friends); //false
alert(person1.sayName === person2.sayName); //true

2、继承时遇到的问题

在继承的时候，也会出现与创建对象时相类似的问题。

a.使用constructor继承的时候会把父类中的Prototype方式声明的方法变成子类中的constructor方式声明的方法，出现上述1）的问题。
b.使用Prototype 继承的时候会把父类中的constructor方式声明的变量变成子类中的prototype方式声明的变量，出现上述2）的问题。

如下代码是正确的继承形式：

function SuperType(name){
this.name = name;
this.colors = [“red”, “blue”, “green”];
}
SuperType.prototype.sayName = function(){
alert(this.name);
};
function SubType(name, age){
//inherit properties
SuperType.call(this, name);
this.age = age;
}
//inherit methods
SubType.prototype = new SuperType();
SubType.prototype.sayAge = function(){
alert(this.age);
};
var instance1 = new SubType(“Nicholas”, 29);
instance1.colors.push(“black”);
alert(instance1.colors); //”red,blue,green,black”
instance1.sayName(); //”Nicholas”;
instance1.sayAge(); //29
var instance2 = new SubType(“Greg”, 27);
alert(instance2.colors); //”red,blue,green”
instance2.sayName(); //”Greg”;
instance2.sayAge(); //27

3、多态的模拟

Javascript对多态特性的支持非常弱，其它面向对象语言的多态一般都由方法重载和虚方法来实现多态，Javascript也通过这两种途径来实现。

1）重载：由于Javascript是弱类型的语言，而且又支持可变参数，当在定义重载方法的时候，解释器无法通过参数类型和参数个数来区分不同的重载方法，因此方法重载是不被支持的！当先后定义了同名的方法的时候，后定义的方法会覆盖先定义的方法！

var MyClass=function(){
    var AddNum=function(a,b){
        return a+b;
    }
    var AddString=function(a,b){
        return "I am here"+a+b;
    }
    this.Add=function(a,b){
        if(typeof(a)=="number")
            return AddNum(a,b);
        else
            return AddString(a,b);
    }
}
var MyObj = new MyClass();
var X = MyObj.Add(5,6);
var Y = MyObj.Add("A","FFFFFF");
alert(X);        //11
alert(Y);        //I am hereAFFFFFF

2）虚方法：Javascript解释执行的特性，可以在基类中调用将要在派生类中定义的方法，那么这个基类方法就相当于虚方法，可以实现模拟多态

function BaseClass(){
    this.Hello=function(){
        return this.Say();
    }
}
function MyClassA(){
    this.Say=function(){
        return "This is MyClassA";
    }
}
function MyClassB(){
    this.Say=function(){
        return "This is MyClassB";
    }
}
MyClassA.prototype = new BaseClass();
MyClassB.prototype = new BaseClass();
var ObjA = new MyClassA();
var XX = ObjA.Hello();
alert(XX);            //This is MyClassA
var ObjB = new MyClassB();
var YY = ObjB.Hello();
alert(YY);            //This is MyClassB