javascript1

来源:互联网 发布:天津天水淘宝城怎么样 编辑:程序博客网 时间:2024/03/28 18:59

Javascript学习笔记1——数据类型

在Javascript中只有五种简单类型,分别为null,undefined,boolean,String和Number.一种复杂类型:object。

代码类型只有一种形式就是function。

undefined:未定义,我们也可称之为不存在,typeof(undefined)=undefined.

null:为空。undefined是不存在,而null是存在,但却无。typeof(null)=object,但null又不是object,这就是null的神奇而独特之处。

boolean:true or false。

Number:NaN和Infinity是两个特殊之数,NaN代表一个无法用数值来表示的数字,而Infinity代表一个无穷大的数字,相对的,-Infinify则代表负无穷大。在此有两点特殊的地方:NaN!=NaN,Infinity/Infinity=NaN。在Number类型中,有个非常有用的方法:ToString(),他可以接受一个从2到36的数字,然后把我们的Number转换为相应的进制数。

String:字符串,Javascript中没有字符的概念,字符串是表示文本的最小单位。在字符串中,有这样的两个函数,分别是charAt(index)和charCodeAt(index)分别返回对应索引的字符和字符Unicode编码。在我们平时,可能经常会使用下标的方式访问,如s[10],可是这并不是ECMAScript的标准,应该尽量避免。

Javascript的一切类型都是基于这五个简单类型向上搭建。这五个类型之间又有着万千复杂的关系,undefined,null,0,“”转换为boolean时就是false,而除去这四个外,所有的都为true。但是在这五个当中,除了undefined==null,其他又都不相等。

我们在此又有着这样和强类型语言不通之处,例如123==“123”。那么我们如何能够区分类型呢?这个时候:全等于:===就发挥了用场。

Javascript学习笔记2——函数

在Javascript中,function才是Javascript的第一型。当我们写下一段函数时,其实不过是建立了一个function类型的实体。

就像我们可以写成这样的形式一样:

function Hello() {            alert("Hello");        }        Hello();        var Hello = function () {            alert("Hello");        }        Hello();

其实都是一样的。

但是当我们对其中的函数进行修改时,会发现很奇怪的问题。

    <script type="text/javascript">        function Hello() {            alert("Hello");        }        Hello();        function Hello() {            alert("Hello World");        }        Hello();    </script>

 

我们会看到这样的结果:连续输出了两次Hello World。而非我们想象中的Hello和Hello World。

这是因为Javascript并非完全的按顺序解释执行,而是在解释之前会对Javascript进行一次“预编译”,在预编译的过程中,会把定义式的函数优先执行,也会把所有var变量创建,默认值为undefined,以提高程序的执行效率。也就是说上面的一段代码其实被JS引擎预编译为这样的形式:

    <script type="text/javascript">        var Hello = function() {            alert("Hello");        }        Hello = function() {            alert("Hello World");        }        Hello();        Hello();    </script>

我们可以通过上面的代码很清晰地看到,其实函数也是数据,也是变量,我们也可以对“函数“进行赋值(重赋值)。当然,我们为了防止这样的情况,也可以这样:

 

    <script type="text/javascript">        function Hello() {            alert("Hello");        }        Hello();    </script>    <script type="text/javascript">        function Hello() {            alert("Hello World");        }        Hello();    </script>

这样,程序被分成了两段,JS引擎也就不会把他们放到一起了。

Javascript学习笔记2——函数

在Javascript中,function才是Javascript的第一型。当我们写下一段函数时,其实不过是建立了一个function类型的实体。

就像我们可以写成这样的形式一样:

function Hello() {            alert("Hello");        }        Hello();        var Hello = function () {            alert("Hello");        }        Hello();

其实都是一样的。

但是当我们对其中的函数进行修改时,会发现很奇怪的问题。

    <script type="text/javascript">        function Hello() {            alert("Hello");        }        Hello();        function Hello() {            alert("Hello World");        }        Hello();    </script>

 

我们会看到这样的结果:连续输出了两次Hello World。而非我们想象中的Hello和Hello World。

这是因为Javascript并非完全的按顺序解释执行,而是在解释之前会对Javascript进行一次“预编译”,在预编译的过程中,会把定义式的函数优先执行,也会把所有var变量创建,默认值为undefined,以提高程序的执行效率。也就是说上面的一段代码其实被JS引擎预编译为这样的形式:

    <script type="text/javascript">        var Hello = function() {            alert("Hello");        }        Hello = function() {            alert("Hello World");        }        Hello();        Hello();    </script>

我们可以通过上面的代码很清晰地看到,其实函数也是数据,也是变量,我们也可以对“函数“进行赋值(重赋值)。当然,我们为了防止这样的情况,也可以这样:

 

    <script type="text/javascript">        function Hello() {            alert("Hello");        }        Hello();    </script>    <script type="text/javascript">        function Hello() {            alert("Hello World");        }        Hello();    </script>

这样,程序被分成了两段,JS引擎也就不会把他们放到一起了。

Javascript学习笔记4——Eval函数

在初学JS的时候就知道这个函数,却一直没有了解过他的用途,也一直都是睁一只眼闭一只眼,这次来深入地了解一下这个函数的作用。

eval的作用其实很简单,就是把一段字符串传递给JS解释器,由Javascript解释器将这段字符串解释成Javascript代码,并且执行他。

举个最简单的例子:

    <script type="text/javascript">        eval("alert(1+1)");    </script>

 

很简单,把字符串解释成JS代码并执行,弹出2。

当然,上面的例子只是个玩具,在实际中没有人会傻到这么用。我想大家最基本的使用eval函数都是应该在DOM中,例如我们有div1,div2,div3,那么在document.getElementByID时我们的ID没有办法去得到,那么最简单的办法就是在for循环中,使用eval来拼接这么一段程序。例如这样:

    <script type="text/javascript">        for (var loop = 1; loop < 10; loop++) {            eval('document.getElementById("div"+loop).innerHTML="123"');        }    </script>

最基本的用法说完,相信大家还是对这个函数意犹未尽,如果这个函数只有这么点用法,那就太无聊了。那我们就一点点来剖下一下eval()函数。

我们就先从eval的作用域说起,先看这样一段函数:

    <script type="text/javascript">        eval("var i=3");        alert(i);    </script>

代码很简单,结果可以弹出3。接下来再对比这段代码:

    <script type="text/javascript">        var test = function () {            eval("var i=3");            alert(i);        }        test();        alert(i);    </script>

结果是首先弹出3,然后是undefined。

那么说明:eval()函数动态执行的代码并不会创建新的作用域,其代码就是在当前的作用域执行的。因此也就是说,eval()函数也完全可以使用当前作用域的this,argument等对象。

在IE中,支持这样一种和eval()非常类似的函数叫做:execScript()。我们可以来写段简单的代码。

    <script type="text/javascript">        var test = function () {            execScript("var i=3");            alert(i);        }        test();        alert(i);    </script>

结果弹出了2个3,这也就看出了execScript函数的特点,首先他和eval相类似,都能将字符串解释成JS代码并且执行,但是他的作用域不是当前作用域,而是全局作用域。当我们把上面的代码放到Firefox和谷歌浏览器上去试试:发现在Firefox上execScript上代码是无效的,那么也说明一个问题,execScript代码的浏览器兼容性是有问题的。

那么就引申出这样一个问题,我们如何能把这两个函数的“优点”给汇总到一起呢,也就是说,全局+浏览器兼容性。上网搜了下,自己给汇总了一下,大概是这样:

    <script type="text/javascript">        var StrongEval = function (code) {            if (window.navigator.userAgent.indexOf("MSIE") >= 1) {                execScript(code);            }            if (window.navigator.userAgent.indexOf("Firefox") >= 1) {                window.eval(code);            }            else {                execScript(code);            }        };        var Test = function () {            StrongEval("var i=3");        }        Test();        alert(i);    </script>

这样就可以完美地兼容FF和IE了,其本质代码就在于在FF中eval和window.eval并不等效,这是个很奇妙的事。

另外,我们还可以用eval+with实现一些奇淫技巧。

我们在一般意义上可以写出这样的代码:

var obj = function () {    this.a = 1;    this.b = 2;    this.c = 5;    this.fun = function () {        this.c = this.a + this.b;    }};var o = new obj();o.fun();alert(o.c);

或者是这样:

var obj = {    a: 1,    b: 2,    c: 5,    fun: function () {        this.c = this.a + this.b;    }}

再或者是这样:

var obj = function () {    this.a = 1;    this.b = 2;    this.c = 5;};obj.prototype.fun = function () {    this.c = this.a + this.b;}var o = new obj();o.fun();alert(o.c);

无论怎么样,你是不是对这样的this感觉厌烦了呢?那就让我们采取个很另类的办法吧,让至少在感官上可能会舒服一点。

    <script type="text/javascript">        var funtemp = function () {            c = a + b;        }        var obj = {            a: 1,            b: 2,            c: 5        };        var fun;        with (obj) {            eval("fun = " + funtemp);        }        fun();        alert(obj.c);    </script>

这个很勉强,那么好,我们不讨论什么看着舒服不舒服。我们来讨论这样一种情况。

    <script>        var DBCommon = function () {            alert("1."); CreateConnection();            alert("2."); OpenConnection();            alert("3."); CreateCommand();            alert("4."); ExcuteCommand();            alert("5."); CloseConnection();        }                var SQLServerCommon = {            CreateConnection: function () { alert("建立SQL Server连接"); },            OpenConnection: function () { alert("打开SQL Server连接"); },            CreateCommand: function () { alert("创建¨SQL Server命令"); },            ExcuteCommand: function () { alert("执行DSQL Server命令"); },            CloseConnection: function () { alert("关闭SQL Server连接"); }        };        var OracleCommon = {            CreateConnection: function () { alert("建立¢Oracle连接"); },            OpenConnection: function () { alert("打开aOracle连接"); },            CreateCommand: function () { alert("创建¨Oracle命令"); },            ExcuteCommand: function () { alert("执行DOracle命令"); },            CloseConnection: function () { alert("关闭?Oracle连接"); }        };        with (SQLServerCommon) {            eval("forSQLServer=" + DBCommon);        }        with (OracleCommon) {            eval("forOracle=" + DBCommon);        }        forSQLServer();        forOracle();            </script>

我们又是否可以把这个看成是一个简陋的模板方法模式呢?呵呵。我们也可以把这个称为利用eval和with配合改变函数的上下文。

不过话又说回来,Eval在一般的情况中是很少被用到的,我们是完全可以避免来使用它的。

 

 

Javascript学习笔记5——类和对象

首先,不得不说,我无法达到抛开类和对象的概念来看Javascript的境界,对于Javascript是否是面向对象的说法有很多,不过我最认同的还是Javascript是一种“基于prototype的面向对象语言”。

面向对象语言三大特点:继承,多态,封装,这三点虽然Javascript没有提供天然的语法实现,但是我们都可以通过prototype等技巧来实现,因此这种说法似乎不过分。

在Javascript中,构造对象有三种方式:

1. 首先,我们要明确一个概念,Javascript是一种弱类型的语言,一方面体现在Javascript的变量,返回类型都是没有强类型约束的,另一方面,Javascript可以为对象任意添加属性和方法。根据这个,我们可以写出这样的代码:

    <script type="text/javascript">        var person = {};        person.name = "飞林沙";        person.age = 21;        person.Introduce = function () {            alert("My name is " + this.name + ".I'm " + this.age);        };        person.Introduce();      </script>

这里的person就是我们构造出的一个对象。

2. 我们也可以利用JSON的形式来构造一个对象。

    <script type="text/javascript">        var person = {            name: "飞林沙",            age: 21,            Introduce: function () { alert("My name is " + this.name + ".I'm " + this.age); }        };        person.Introduce();      </script>

 

这个是不是很像我们在C#3.0里提出的匿名对象呢?

protected void Page_Load(object sender, EventArgs e){    var person = new    {        name = "飞林沙",        age = 21    };    Response.Write("My name is " + person.name + ".I'm " + person.age);}

不同的是在Javascript中,函数是一种类型,所以可以赋给某个变量,但是C#不可以。

但是上面两种方法我们看到,我们都是单独定义了一个对象。接下来让我们把他们抽象出来成为一个类。

    <script type="text/javascript">        var Person = function () {            this.name = "飞林沙";            this.age = 21;            this.Introduce = function () {                alert("My name is " + this.name + ".I'm " + this.age);            };        };        var person = new Person();        person.Introduce();    </script>

 

可是在这里,我们看到,属性都已经被写死了,我们根本没办法为每个对象单独订制,解决办法很简单:

    <script type="text/javascript">        var Person = function (name, age) {            this.name = name;            this.age = age;            this.Introduce = function () {                alert("My name is " + this.name + ".I'm " + this.age);            };        };        var person = new Person("飞林沙", 21);        person.Introduce();    </script>

好,我们来对比一下第二种和第三种写法,两者是等效的。在第二种写法中,实际上是构建了一个JSON对象,而我们又知道JSON本质上其实就是一个键值对,那么我们是否也可以用同样的方式来理解一个对象呢?

我们来写出这样的测试代码试试:

    <script type="text/javascript">        var Person = function (name, age) {            this.name = name;            this.age = age;            this.Introduce = function () {                alert("My name is " + name + ".I'm " + age);            };        };        var person = new Person("飞林沙", 21);        for (var p in person) {            alert(p);        }        alert(person["name"]);    </script>

这样的代码没偶任何问题,首先用遍历的方式来找到person所有的key(属性和方法名)。然后我们用索引的方式来访问person对象的name属性。

这些都没有问题,可是我们是不是看到了一个引申的问题,从传统面向对象的语言来看,name和age应该属于私有变量,那么这样用person简简单单的访问,是不是破坏了封装性呢?

还记得我们在前文中说过的么?var的叫变量,没有var的叫属性。那么我们如果讲代码改成这个样子。

    <script type="text/javascript">        var Person = function (name, age) {            var name = name;            var age = age;            this.GetName = function () {                return name;            }            this.GetAge = function () {                return age;            }            this.Introduce = function () {                alert("My name is " + name + ".I'm " + age);            };        };        var person = new Person("飞é林?沙3", 21);        alert(person["name"]);        alert(person.GetName());    </script>

这样就可以封装得很好了,这也是在Javascript中的封装方式。

好,关于Javascript的类和对象就说到这,但是这里面仍然有一些问题。我们会在下文中提及。

 

 

Javascript学习笔记6——prototype的提出

首先我们继续上文的代码,我们来把这段代码延伸一下:

    <script type="text/javascript">        var Person = function (name, age) {            this.name = name;            this.age = age;            this.Introduce = function () {                alert("My name is " + this.name + ".I'm " + this.age);            };        };        var person1 = new Person("飞林沙", 21);        var person2 = new Person("kym", 26);        alert(person1.Introduce == person2.Introduce);    </script>

 

结果弹出false。也就是说,这两个对象的方法是不同的方法。那么我们知道,在C#中,每个对象会维护着一个方法表,可是方法表应该指向同一块地址。如果是这样的话,那当我们声明了100个对象,是不是要建立100个对象拷贝,对空间是不是一个很大的浪费呢?

于是我们就想了这样的解决办法,用prototype:

    <script type="text/javascript">        var Person = function (name, age) {            this.name = name;            this.age = age;        };        Person.prototype.Introduce = function () {            alert("My name is " + this.name + ".I'm " + this.age);        }        var person1 = new Person("飞林沙", 21);        var person2 = new Person("kym", 26);        alert(person1.Introduce == person2.Introduce);    </script>

 

这样就可以了。所以你还会再说是否用prototype都是一样的么?其实我以前也是这么理解的,在这次偶然的试验中看到了这个问题。

Javascript学习笔记7——原型链的原理

 

说到prototype,就不得不先说下new的过程。

我们先看看这样一段代码:

    <script type="text/javascript">        var Person = function () { };        var p = new Person();    </script>

很简单的一段代码,我们来看看这个new究竟做了什么?我们可以把new的过程拆分成以下三步:

<1> var p={}; 也就是说,初始化一个对象p。

<2> p.__proto__=Person.prototype;

<3> Person.call(p);也就是说构造p,也可以称之为初始化p。

关键在于第二步,我们来证明一下:

    <script type="text/javascript">        var Person = function () { };        var p = new Person();        alert(p.__proto__ === Person.prototype);    </script>

这段代码会返回true。说明我们步骤2的正确。

那么__proto__是什么?我们在这里简单地说下。每个对象都会在其内部初始化一个属性,就是__proto__,当我们访问一个对象的属性时,如果这个对象内部不存在这个属性,那么他就会去__proto__里找这个属性,这个__proto__又会有自己的__proto__,于是就这样一直找下去,也就是我们平时所说的原型链的概念。

按照标准,__proto__是不对外公开的,也就是说是个私有属性,但是Firefox的引擎将他暴露了出来成为了一个共有的属性,我们可以对外访问和设置。

好,概念说清了,让我们看一下下面这些代码:

    <script type="text/javascript">        var Person = function () { };        Person.prototype.Say = function () {            alert("Person say");        }        var p = new Person();        p.Say();    </script>

这段代码很简单,相信每个人都这样写过,那就让我们看下为什么p可以访问Person的Say。

首先var p=new Person();可以得出p.__proto__=Person.prototype。那么当我们调用p.Say()时,首先p中没有Say这个属性,于是,他就需要到他的__proto__中去找,也就是Person.prototype,而我们在上面定义了Person.prototype.Say=function(){}; 于是,就找到了这个方法。

好,接下来,让我们看个更复杂的。

    <script type="text/javascript">        var Person = function () { };        Person.prototype.Say = function () {            alert("Person say");        }        Person.prototype.Salary = 50000;        var Programmer = function () { };        Programmer.prototype = new Person();        Programmer.prototype.WriteCode = function () {            alert("programmer writes code");        };        Programmer.prototype.Salary = 500;        var p = new Programmer();        p.Say();        p.WriteCode();        alert(p.Salary);    </script>

我们来做这样的推导:

var p=new Programmer()可以得出p.__proto__=Programmer.prototype;

而在上面我们指定了Programmer.prototype=new Person();我们来这样拆分,var p1=new Person();Programmer.prototype=p1;那么:

p1.__proto__=Person.prototype;

Programmer.prototype.__proto__=Person.prototype;

由根据上面得到p.__proto__=Programmer.prototype。可以得到p.__proto__.__proto__=Person.prototype。

好,算清楚了之后我们来看上面的结果,p.Say()。由于p没有Say这个属性,于是去p.__proto__,也就是Programmer.prototype,也就是p1中去找,由于p1中也没有Say,那就去p.__proto__.__proto__,也就是Person.prototype中去找,于是就找到了alert(“Person say”)的方法。

其余的也都是同样的道理。

这也就是原型链的实现原理。

最后,其实prototype只是一个假象,他在实现原型链中只是起到了一个辅助作用,换句话说,他只是在new的时候有着一定的价值,而原型链的本质,其实在于__proto__!

 

Javascript学习笔记8——用JSON做原型

Javascript学习笔记5——类和对象中,我简单地提到了利用JSON去构造一个对象。代码如下:

    <script type="text/javascript">        var People = {            name: "kym",            age: 21,            SayHello: function () {                alert("Hello,My name is " + this.name + ".I am " + this.age);            }        }        alert(People.name);        People.SayHello();    </script>

但是我们是不能重用这个对象的,我们如何把这个对象作为原型的呢?

首先,在一个JSON对象有一个构造方法是不可能的了,那么我们就做一个简单的“工厂”吧,写一个方法来专门负责创建。

    <script type="text/javascript">        var People = {            Create: function (name, age) {                this.name = name;                this.age = age;            },            SayHello: function () {                alert("Hello,My name is " + this.name + ".I am " + this.age);            }        }        People.Create("kym", 21);        People.SayHello();    </script>

但是通过这个方法我们却发现,我们没有办法用People作为原型,让我们回顾一下:Javascript学习笔记7——原型链的原理 这篇文章,我们想一下这个过程:

var p=new People();==>p.__proto__=People.prototype。于是当我们p.SayHello()的时候就会去People.prototype中去找,结果什么都找不到。

如果可以People.prototype.SayHello=function(){}就可以解决这个问题。但是我们知道,只有function才可以有prototype。

那么我们想想之前的推导公式,怎么样能让p.SayHello()呢?如果可以p.__proto__=People就好了。那么我们想个办法:

既然在new的时候,某个对象的__proto__只能等于某个函数的prototype,我们设置一个函数X,令p.__proto__=X.prototype,我们再令X.prototype=People。这样的关系是这样:

    <script type="text/javascript">        var People = {            Create: function (name, age) {                this.name = name;                this.age = age;            },            SayHello: function () {                alert("Hello,My name is " + this.name + ".I am " + this.age);            }        };                var X = function () { };        X.prototype = People;        var p = new X();        p.Create("kym", 21);        p.SayHello();    </script>

这样就相当于用X做了一个中间变量,使得我们可以访问JSON对象的内部属性。但是这样是不是不太优雅呢?我们每次创建一个对象时,都需要来写这样一个辅助的函数。那好,我们就把这个过程封装起来:

var Factory = {    CreatePeople : function (className,name,age) {        var temp = function () {            className.Create(name, age);        };        temp.prototype = className;        var result = new temp();        return result;    }};var people = Factory.CreatePeople(People,"kym",21);people.SayHello();

但是这样也有一个缺点,就是每次我增加一个类,就需要向Factory里注册一个新方法,这样是很麻烦的,我在很久以前的 玩转方法:call和apply 中说过关于call和apply的区别,因为这里的参数不固定,我们不可能一一列举,因此我们在这里可以用apply来改善这个方法:

    <script type="text/javascript">        var People = {            Create: function (name, age) {                this.name = name;                this.age = age;            },            SayHello: function () {                alert("Hello,My name is " + this.name + ".I am " + this.age);            }        };        var Factory = {            Create: function (className, params) {                var temp = function () {                    className.Create.apply(this, params);                };                temp.prototype = className;                var result = new temp();                return result;            }        };        var people = Factory.Create(People,["kym",21]);        people.SayHello();    </script>

这样,一个完整的创建类就诞生了!那么我们每次创建“类”时就都可以用JSON来做了,然后用户每次都统一来调用Factory.Create()就可以了!

 

Javascript学习笔记9——prototype封装继承

上文中,我利用prototype的原理做了一个封装的New,然后我就想到,我是否可以用prototype的原理进一步封装面向对象的一些基本特征呢?比如继承。

好,那就让我们一步步打造,首先让我们来看下继承原本的写法:

    <script>        var Person = function(name, age) {            this.name = name;            this.age = age;        }        Person.prototype.SayHello = function () {            alert(this.name + "," + this.age);        };        var Programmer = function (name, age, salary) {            Person.call(this, name, age);            this.salary = salary;        };        Programmer.prototype = new Person();        var pro = new Programmer("kym", 21, 500);        pro.SayHello();    </script>

我们看到,在实际上,继承的根本就在于这一步Programmer.prototype=new Person()。也就是说把Person加到原型链上。这一点在Javascript学习笔记7——原型链的原理 已经有过比较详尽的解释。

那也就是说,我们实现的关键就在于原型链的打造。

在上文中,我们用JSON来打造了一个原型,其原型链是p.__proto__=Person。那么我们希望在这个上封装继承,那么原型链应该是p.__proto__.__proto__=SuperClass,也就是说Person.__proto__=SuperClass。但是按照我们上面代码的继承方法,原型链关系是Person.__proto__=SuperClass.prototype。

这个和我们在上文中一样,我们的办法就是借助一个辅助函数,将原来的函数内的属性赋给X,然后令X.prototype=SuperClass即可,也就是说我们将子原型进行一个封装。

好,就按照这个思路,我们来实现利用原型链的继承关系的封装。

    <script>        var Factory = {            Create: function (className, params) {                var temp = function () {                    className.Create.apply(this, params);                };                temp.prototype = className;                var result = new temp();                return result;            },            CreateBaseClass: function (baseClass, subClass) {                var temp = function () {                    for (var member in subClass) {                        this[member] = subClass[member];                    }                };                temp.prototype = baseClass;                return new temp();            }        };        var People = {            Create: function (name, age) {                this.name = name;                this.age = age;            },            SayHello: function () {                alert("Hello,My name is " + this.name + ".I am " + this.age);            }        };        var Temp = {            Create: function (name, age, salary) {                People.Create.call(this, name, age);                this.salary = salary;            },            Introduce: function () {                alert(this.name + "$" + this.age + "$" + this.salary);            }        };        var Programmer = Factory.CreateBaseClass(People, Temp);        var pro = Factory.Create(Programmer, ["kym", 21, 500]);        pro.SayHello();    </script>

 

这样就完成了我们对继承关系的封装。当然,我们也可以不单独写一个变量:

var Programmer = Factory.CreateBaseClass(People, {    Create: function (name, age, salary) {        People.Create.call(this, name, age);        this.salary = salary;    },    Introduce: function () {        alert(this.name + "$" + this.age + "$" + this.salary);    }});

当然,这全凭个人爱好了,个人认为第一种办法相对更清晰一些,但是第二种办法则更优雅。

 

 

原创粉丝点击