Javascript基础
访问量:2476

一、构造函数的返回值

在Javascript中,当以new+函数名的形式调用某个函数时候,往往把这个函数称为构造函数。构造函数的返回值,跟函数里面的关键字return有一定关系。

若函数中不存在返回值,则返回的是new创建的对象

若函数中存在返回值,当return返回值为基本类型,如字符串、数字等,则返回的是new创建的对象;当return返回值为object或是function类型,则返回return后面的值。

function F1(){
    this.name = 'dqs';
    return 1;
}
function F2() {
    this.name = 'dqs';
    return 'hello';
}
function F3() {
    this.name = 'dqs';
    return {};
}
function F4() {
    this.name = 'dqs';
    return [3,5];
}
function F5() {
    this.name = 'dqs';
}
function F5() {
    this.name = 'dqs';
}
function F6() {
    this.name = 'dqs';
    return function() {
        this.name = 'pps';
    }
}
var f1 =   new F1();
var f2 =   new F2();
var f3 =   new F3();
var f4 =   new F4();
var f5 =   new F5();
var f6 =   new F6();

console.log(f1);
console.log(f2);
console.log(f3);
console.log(f4);
console.log(f5);
console.log(f6);

上面程序返回值:

二、立即执行函数

Javascript中变量作用域是在函数范围内,ECMAScript6中才出现块级作用域,但是目前我们使用的Javascript还是基于ECMAScript5。于是,我们定义的变量很有可能会污染全局变量。因为,当我们引入某个JS文件的时候,可能我们并不知道,自己定义的变量是否和js文件中的变量发生冲突,如当我们引入jQuery后,却定义了var $ = null,这样就会导致无法通过$来使用jQuery。此时,我们可以借助立即执行函数,限制变量作用域,立即执行函数有下面两种形式:

//形式一
(function(){

})()
//形式二
(function(){
  
}())

  当然,为了防止定义的变量冲突,也可以使用命名空间,如下:

 var COMMON = {};
  //定义一些变量或是函数
 COMMON.PERSON= {};
 COMMON.PERSON.name = 'dqs';
 COMMON.PERSON.show = function(){
    console.log(this.name);
 };
 COMMON.PERSON.show();

三、访问级别

在Javascript中,没有像Java语言里面public、private、protected这样的关键字,来控制变量或是方法的访问级别,默认情况下,所有的成员都是共有的,都可以被访问。那么我们怎样实现私有和公有之分呢?我们可以利用Javascript中变量作用域是基于函数的这一特性,来实现这一效果。


function Person() {
  var age = 18; //私有

  this.name = 'dqs';//公有
  this.getAge = function() {
    return age;
  }
  this.setAge = function(n){
      age = n;
  }
}
var p = new Person();
console.log(p.getAge());//可以访问
console.log(p.name); //可以访问
console.log(p.age); //不可以访问

四、this

Javascript虽然可以采用面向过程方式编程,但是我更情愿将其称为面向对象语言,因为你写的程序,都被绑定到某个对象之上。譬如,你在全局作用域中,定义的变量var name = 3;,其实是在给window对象添加了一个name的属性。可以通过window.name或是window['name']进行访问。在面向对象编程中,this是一个很重要的关键字,在Javascript中,理解在不同的场景中this代表的意义,也比较重要。

console.log(this == window); //全局作用域中的this等于window

function Person(){
  console.log(this);
  this.compare = function(p){
    console.log(p == this);
  }
}
Person(); //若以普通函数方式调用,函数内部的this等于window

var p = new Person(); //若以构造函数方式调用,函数内部的this等于new创建的实例
p.compare(p); 

//我们可以通过call和apply来改变函数里面的this
var obj = {};
Person.call(obj);
Person.apply(obj);

执行结果如下:

六、原型

原型说白了,就是一个对象而已,只是这个对象被构造函数创建的实例共享着而已。首先,我们来看一个案例,如下:

function Person(){
  this.compare = function(){

  }
}

var p1 = new Person(); 
var p2 = new Person(); 
console.log(p1.compare == p2.compare);//返回false

这说明,p1和p2的compare使用的并不是同一个函数,每次新建一个对象的时候,都会在内存开辟一个空间,保存函数,这是不可取的。下面我们来使用原型实现这个案例:

function Person(){
  
}
Person.prototype.compare = function(){

}

var p1 = new Person(); 
var p2 = new Person(); 
console.log(p1.compare == p2.compare);//true

当然,我们使用原型还可以实现继承,如下:

function Person(){
  this.name = 'Person';
}
Person.prototype.show = function(){
  console.log(this.name);
}

function Student(){
  this.name = 'Student';
}
Student.prototype = new Person();

var p1 = new Student(); 
p1.show(); //Student


请在下面输入需要执行的语句