首页 > 代码库 > JavaScript--基于对象的脚本语言学习笔记(一)

JavaScript--基于对象的脚本语言学习笔记(一)

2024-07-11 17:42:28   222人阅读


1、两种嵌入js的方式
   使用javascript前缀构建url:<a href="javascript:alert(‘运行JavaScript。。‘)">运行js</a>
   js脚本放在<style></style>之间:
	<style type="text/javascript">	
	alert("运行JavaScript。。")
	</script>
2、如果没有声明变量直接使用会报错：ReferenceError: x is not defined

   如果声明了没有赋值，则该变量的值为undefined

3、单独保存js 文件
   <script src=http://www.mamicode.com/"test.js" type="text/javascript"></script>

4、3个强制类型转换的函数
   toString()将布尔值、数值转换为字符串
   parseInt()将字符串、布尔值转换为整数
   parseFloat()将字符串、布尔值转换为浮点数
5、javascript的变量没有块范围，这一点和Java、C++等不同
6、如果用var来定义变量，程序会强制定义一个新变量。
   尽管js是弱类型脚本语言，声明变量时无需指定变量的基本类型。但是js的值
   保存到内存时也是有类型的。有5个基本类型。
7、Infinity、-Infinity与其他数值进行算术运算时，整个算式变成：NaN
   两个Infinitiy是相等的
   两个NaN不等
8、js中的复合类型
   Object：对象
   Array：数组
   Function：函数
9、js中的数组元素类型并不要求相同，且数组长度可以任意变化
   访问数组元素时不会产生数组越界，只会显示该元素的值为undefined
10、void强制指定表达式不会有返回值
11、
var a=[];
    for(var i=0;i<10;a[i++]=i+10);//利用空语句
    for(index in a){
	document.writeln(a[index]+"<br/>");
 }//index保存的是索引值

12、js支持自已定义错误，js只有一个异常类：Error，catch块类也无需声明异常的类
for(var i=0;i<10;i++){
    if(i>4) throw new Error("用户自定义错误");		 
    document.writeln(i+"<br/>");
}
13、使用with避免重复书写对象
    with(object){
statements
}
   如：省写了document
with(document){
		 writeln( "hello<br/>");
		 writeln( "hello2<br/>"); 
		 writeln( "hello3<br/>");
	}
14、js的函数即是可重复调用的“程序块”，也是一个Function实例
    推荐使用匿名函数
var f=function(parameter){
       函数体
    };
    例子：
var a=function(){ alert("调用匿名函数")};
	a();  //函数调用
  
15、递归一定要向已知点追溯

★16、注意：js的函数不仅是一个函数，更是一个类，在定义js函数的同时也得到一个与该函数同名的类
     该函数也是该类的唯一构造器。(定义一个函数的同时，实质上也定义了一个构造器，当定义函数时，
     函数中以this修饰的变量是实例属性，如果某个属性值是函数时，即可认为该属性变成了方法)
     因此有两种方式调用函数：
     1.直接调用
     2.用new 关键字调用，这样总会有返回值，返回值就是一个js对象
例：function Person(name,age){
		this.age=age;
		this.name=name;
		this.info=function(){
		document.writeln("我的名字是："+this.name+"</br>");
		document.writeln("我的age是："+this.age+"</br>");
		};
		
		}
		//创建p对象
		var p=new Person("周鹏程",24);
		p.info();
//Person类定义了一个方法，通过使用匿名函数使代码更加简洁
上面把js中定义的一个函数附加到某个对象上，作为该对象的方法
事实上，如果没有明确指定将函数“附加”到哪个对象上，该函数将“附加”到window对象上

17、js与Java不一样，它是一种动态语言，它允许随时为对象增加属性和方法
    其实当我们直接为对象的某个属性赋值时，即视为给对象增加属性。
    注意：JavaScript对象不能访问它所属类的类属性
    如果直接定义一个全局变量，实际上这个变量会被“附加”到window对象上，作为window对象的实例属性

18、js中调用函数的3种方法
   1.直接调用：以函数“附加”的对象作为调用者，在函数后括号内传入参数来调用函数
   2.call()方法动态调用函数
    例子： 
var each=function(arr,fn){
			for(var s in arr){
				fn.call(null,s,arr[s]);
			}
		}
		each([4,20,3],function(a,b){
			document.writeln("数组的第"+a+"个元素是："+b+"<br/>");
		}
		);
	//调用者.函数(参数1，参数2...)<=>函数.call(调用者，参数1，参数2...)

   3.以apply()方法调用函数
     通过call()调用函数时，必须在括号中详细地列出每个参数。
     而通过apply()调用函数时，可以在括号中以arguments来代表所有参数 
var myfun=function(a,b){
		alert("a="+a+"\nb="+b);
		}
		myfun(1,2);
		myfun.call(window,1,2);		
		var fun2=function(num1,num2){
		    myfun.apply(this,arguments);
		}
		fun2(1,2);
		myfun.apply(window,[1,2]);//arguments来代表所有参数,arguments本质上是个数组

19、js中函数是“一等公民”，它永远是独立的，函数永远不会从属于其他类、对象
 function Person(name){
			 this.name=name;
			 this.info=function(){
				 alert("我的name是："+this.name);
			 }
		 }
		 var per=new Person("zpc");
		 per.info();
		 var name="window的name";
		 per.info.call(window);
		//p.info()即可引用这个函数，可以使用call()方法指定调用者

20、js中可以使用空参数，没有传入实参的参数值将作为undefined处理。js中没有函数重载一说，函数名就是函数的唯一标识
    函数名相同只会导致覆盖
    function test1(){alert("test1");}
    function test1(s){alert("test1"+s);}
    test1();//输出test1undefined

21、由于js是弱类型语言，函数定义的参数列表无需类型声明，这一点为函数调用埋下了隐患。
    可以使用“鸭子类型”的理论改善这个问题：即在函数中先判断参数类型，并判断参数是否包含了需要访问的属性、方法，
    当这些条件都满足时，程序才开始真正处理调用参数的属性、方法。

22、js对象的实质就是关联数组
    例子：
    		function Person(name,age){
		this.age=age;
		this.name=name;
		this.info=function(){
		alert("info method!");
		}
		}
		var p=new Person("zpc",24);		
		//alert(p[age]);
		alert(p['age']);//也能输出正确的年龄
		alert(p.age);
		for(proname in p){
		document.writeln("p对象的"+proname+"属性值为："+p[proname]+"<br/>");
		}

23、尽量避免使用内嵌函数为类定义方法，而应该使用增加prototype属性的方式来增加方法。通过prototype属性来为类动态地
    增加方法会让程序更加安全，性能更加稳定。js的所有类(也就是函数)都有一个prototype属性，当我们为JavaScript类的prototype
    属性增加函数、属性时，则可视为对原有类的扩展。通过使用prototype属性可以对js的内建类进行扩展。
例子： 
function Person(age,name){
		 this.name=name;
		 this.age=age;
		 this.info=function(){
			document.writeln("姓名："+this.name+"</br>");
			document.writeln("年龄："+this.age+"</br>");
		 }
		}


		var p1=new Person(23,"周鹏程");
		p1.info();
		//p1.walk();这里还没有给Person加walk方法
		//所有的Person实例共享一个walk方法,节约内存
		Person.prototype.walk=function(){
		document.writeln(this.name+"正在慢慢溜达。。<br/>");
		}
		document.writeln("<br/>");
		var p2=new Person(25,"鸟鹏");
		p2.info();
		p2.walk();
		p1.walk();

24、js中创建对象的3种方式：
    1.使用new 关键字调用构造器创建对象,如上面的例子
    2.使用Object直接创建对象 
var per=new Object();
		per.name="鸟鹏";
		per.age=24;
		per["gender"]="男";//js允许动态添加属性,js对象的本质是关联数组
		document.writeln(per.name+"<br/>"+per.age+"<br/>"+per.gender);
     js允许将一个已有的函数添加为对象的方法
     例子： 
var per=new Object();
		per.name="鸟鹏";
		per.age=24;
		function abc(){
		document.writeln("对象的name属性："+this.name+"<br/>对象的age属性："+this.age+"<br/>");
		}
		per.info=abc;//添加abc函数为per对象的方法
		per.info();

     js通过new Function()方法来定义匿名函数，可以通过这种方式来为js对象增加方法
     例子：
		var per=new Object();
		per.name="鸟鹏";
		per.age=24;
		per.info=new Function("document.writeln('对象的name属：'+this.name);'<br/>';document.writeln('对象的age属性：<span style="font-family: Arial, Helvetica, sans-serif;">'+this.age);");   </span><span style="font-family: Arial, Helvetica, sans-serif;">per.info();</span>
    3.使用json语法创建对象 
var p={
		name:"zpc",
		age:32
		};
		alert(p);
		//以上就是用json语法创建的p对象


		var person={
			name:"周鹏程",
			gender:'male',
			//属性值可以是任意的基本类型,甚至是json语法创建的对象
			son:{
			name:"鸟鹏",
			age:12		
			},
			info:function(){
				document.writeln("姓名："+this.name);
				document.writeln("gender："+this.gender);
				document.writeln("son:"+this.son);
			}
		}
		person.info();
		//以上就是用json语法创建的person对象


		事实上json语法不仅仅可以用于创建对象，使用JSON语法创建数组也是非常常见的情形
		传统创建数组方式一：
		var a=new Array();
 		a[0]='zpc';
		a[1]='niao';
		传统创建数组方式二：
		var a=new Array('zpc','niao');
		
		使用JSON创建数组：
		var a=['zpc','niao'];


	//一个复杂的JSON对象
		var person={
			name:"周鹏程",
			age:24,
			//第三个属性是数组
			schools:['小学','中学','大学'],
			//第四个属性是对象数组
			parents:[
			  {
				name:'father',
				age:50,
				address:'shanghai'
			  },
			
			  {
				name:'mother',
				age:49,
				address:'nanjing'
			  }
			]
		};
		alert(person.parents);
		alert(person.parents[0].name);

	//事实上json已经发展成为一种轻量级的、跨语言的数据交换格式，成为了xml数据交换格式的有力竞争者














































































































































联系
我们