数据类型，创建函数，调用函数以及定义对象的3种语法

最新推荐文章于 2022-08-18 21:05:14 发布

java_hwy

最新推荐文章于 2022-08-18 21:05:14 发布

阅读量381

点赞数

本文链接：https://blog.csdn.net/java_hwy/article/details/89364464

版权

1. JavaScript数据类型

- 基本数据类型
1、数值类型：包含整数或浮点数。
2、布尔类型：只有true或false两个值。
3、字符串类型：字符串变量必须用引号括起来，引号可以是单引号，也可以是双引号。
4、undefined类型：专门用来确定一个已经创建但是没有初值的变量。
5、null类型：用于表明某个变量的值为空。

- 复合数据类型
（1）对象：Object

var   student = { name: ; sex: ; age: ; } ;

（2）数组：Array

var  a  =  [5,2,1,1,3] ;

（3）函数：function

function  Name(参数){}

2. 创建函数

定义函数的3种方式：

1. 定义命名函数
语法如下：

funciton functionName(parameter-list){
   statements
}

<html>
<script>
	  	  hello('changxu');
	  	  function hello(name){
	  	  	alert(name+"，你好");
	  	  }
</script>
</html>

2. 定义匿名函数
语法如下：

function(parameter list){
 statements
} ;              //注意分号不能丢，无需指定函数名

<html>
<script>
  var f = function(name){          
  document.writeln('匿名函数<br>');
  document.writeln('你好' + name );
};
 f('yeeku');
 </script>
 </html>

3.使用Function类匿名函数
注意：Function类构造器的参数不受限制，各语句用( ; )隔开，最后一个字符串参数是函数的执行体，前面的各字符串参数则是函数的参数。

<html>
<script>
  var f = new Function('name',         
  "document.writeln('Function定义的函数<br>');"
 + " document.writeln('你好' + name );");
// 通过变量调用函数
 f('yeeku');
 </script>
 </html>

3.调用函数

3种调用函数方式：

直接调用函数：最常见的，最普通的方式，以函数附加的对象为调用者，在函数后括号内传入参数来调用函数。

// 调用window对象的alert方法
window.alert("测试代码")；
//调用p对象的walk方法
p.walk()

以 call( ) 方法调用函数：灵活，有时函数调用需要动态传入一个函数引用，为了动态调用函数，就需要使用call方法来调用函数了。

<html>
<script>
 var each = function(array,fn){
  for(var index in array){
  // 以window为调用者来调用fn函数
  // index、array[index]是传给fn函数的参数
  fn.call(null,index,array[index]);
   }
}
// 调用each函数，第一个参数是数组，第二个参数是函数
each([4,20,3],function(index,ele){
   document.write("第" + index + "个元素是：" + ele + "<br />");
   });
   </script>
   </html>

由此可以得到直接调用函数与通过call( )调用函数的关系如下：

调用者.函数（参数1,参数2.....） = 函数.call(调用者,参数1,参数2...)

以 apply( )方法调用函数：
apply( )与call( )区别如下：
1：通过call( )调用函数时，必须在括号中详细地列出每个参数。
2：通过apply( )动态地调用函数时，需要以数组形式一次性传入所有调用参数。

<html>
<script>
  var myfun = function(a,b){
  alert("a的值是：" +a + "\nb的值是：" + b);
}
// 以call( )方法动态调用函数
myfun.call(window,12,23);
// 以apply( )方法动态调用函数
myfun.apply(window,[12,23]);
var example = function(num1,num2){
  //直接用arguments代表调用example函数时传入的所有参数
  myfun.apply(this,arguments);
}
example(20,40);
</script>
</html>

由此可见，apply( )和call( )的对应关系如下：

函数引用.call(调用者,参数1,参数2...) = 函数引用.apply(调用者,[参数1,参数2...])

4.创建对象

JavaScript中创建对象大致有3种方式：

（1）使用new关键字调用构造器创建对象。

<html>
<script>
   function Person(name,age){
     this.name = name;
	 this.age = age;
	 }
	 var p1 = new Person();         //new关键字创建
	 var p2 = new Person('changxu',23);
	 ....

（2）使用Object创建对象。

//创建空对象
var myObj = new Object();
// 增加属性
myObj.name = 'yeeku';
//增加属性
myObj.age = 29;
....

（3）使用JSON语法创建对象

var p ={
  name:'haweiyi',
  gender:'male'
};
alert(p);

<html>
<script>

  var  person = {
     name : 'wawa',
	 age:29,
	 schools:['小学','中学','大学'],
	 parents:[
	    {
		  name : 'father',
		  age:60,
		  address: '广州'
		},
		{
		  name:'mother',
		  age:58,
		  address:'深圳'
		}
	 ]
	 };
	 alert(person.parents[0].age);            //输出的则是   第一个的年龄：60
</script>
</html>

5.类的继承

类的继承有两种基本方法：

1、对象冒充：构造函数使用this关键字给所有属性和方法赋值（构造函数实际上仅仅是赋值函数），所以可以利用一种方式，在类内部直接运行赋值函数，把其this关键字传递给新类。
2、原型链：把超类的一个实例付给子类的prototype对象，即可把超类的固定属性和方法传递给子类，要注意一点，这种方法无法在实例化时传递参数，所以一般采用混合方式进行类的继承。

代码如下：

prototype属性的类继承了原有的类：

<html>
<script>
   function Person(name,age){
     this.name = name;
	 this.age = age;
	 this.info = function(){
	   document.writeln("姓名:"+this.name+"<br />");
	   document.writeln("年龄:"+this.age+"<br />");
	 }
	 }
	 var p1 = new Person('yeeku',23);
	 p1.info();
	 Person.prototype.walk = function(){
	   document.writeln(this.name+'正在慢慢溜达...<br />');
	 }
	 document.writeln('<hr />');
	 var p2 = new Person('changxu',24);
	 p2.info();
	 document.writeln('<hr />');
	 p2.walk();
	 p1.walk();
</script>
</html>

apply或call 伪继承实现方式：

<html>
<script>
  function Person(name,age){
   this.name = name;
   this.age = age;
   
  
 this.sayHello = function(){
    console.log(this.name + "向您打招呼！");
  }     
}  
  var per = new Person("牛博文",22);
  per.sayHello();
  function Student(name,age,grade){
  Person.call(this,name,age);
  //   Person.apply(this,[name,age]);
    this.grade = grade;
  }
  
  Student.prototype.intro = function(){
  console.log("%s是个学生,读%d年级",this.name,this.grade);
  }
  var stu = new Student("孙悟空",34,5);
  console.log(stu instanceof Student);
  console.log(stu instanceof Person);
  stu.sayHello();
  stu.intro();
</script>
</html>