AJAX学习前奏----JS基础加强
AJAX学习前奏----JS基础加强
知识概要:
1.js类&属性&方法的定义
2.静态属性与方法
3.构造方法
4.原型的使用
5.Object对象直接加属性和方法
6.JSON数据
7.继承关系的模拟
8.重载的模拟
9.with语句与forin语句
1.js类&属性&方法的定义
类的定义:
|
一个函数就是一个类 如何定义私有属性,私有的用var声明,公有的用this声明 |
|
<title>js模拟类的相关概念</title> <script type="text/javascript" src="01jquery.js"></script> <script> function Person(){ var name="张三丰";//私有的属性 this.age = 30;//公有的属性 var showInfo = function(){//私有方法,只能调用私有属性 alert(name); } //公有方法,属性都能用(公有的,私有的) this.showInfo = function(){ showInfo(); alert(name+","+this.age); } } var p = new Person();//产生对象 alert(p.name);//undefined alert(p.age);//30 p.showInfo();//不支持这个方法,不能调用 </script> |
2.静态属性&静态方法
|
<script> function Person(){ this.name="刘小晨"; this.age=18; } Person.sex="女";//静态属性 //静态方法 Person.showInfo = function (){//静态方法 alert(this.name+","+this.age+Person.sex); } //静态的调用形式:类名.属性名或方法名 alert(Person.sex);//女 Person.showInfo();//undefined,undefined,女(带“this”的通常表示实例对象) var p = new Person(); //产生一个实例对象 alert(p.name+","+p.age+","+Person.sex);//刘小晨,18,女 p.showInfo();//不以调 </script> |
|
类名.属性名或方法名定义 访问也是类名.属性名或方法名 不能用对象调用 |
3.构造方法 (有参数的构造函数&无参数的构造函数)
|
//------------------5.构造方法------------------------------------------------------------------ //1.无参构造 //2.有参构造 //有参构造 function Person(name,age){ this.name = name; this. age = age; } //无参构造 function Person(){ //如果出现同名参数后,会出现函数的重写 this.name="王康"; this.age = 20; } var p = new Person("陈佳",21); alert(p.name+","+p.age); var pp = new Person(); alert(pp.name+","+pp.age); |
4.原型的使用:
|
示例: Array.prototype.getMax = function(){ var max = this[0]; for(var i=1;i<this.length;i++){ if(max<this[i]) max =this[i]; } return max; } var score = [30,50,67,10,80,45]; function getMax(arr){ var max = arr[0]; for(var i=1;i<arr.length;i++){ if(max<arr[i]) max =arr[i]; } return max; } score.sort(); var maxVal = score.getMax(); //var maxVal = getMax(score); alert(maxVal); alert(score); 增序打印输出 |
|
function Person(){ this.name="苏周周"; this.age = 18; this.hobby = ["爱avi","拍avi","实战avi"]; } //prototype找原型 Person.prototype.sex = "男人"; Person.prototype.hobby = ["爱avi","拍avi","实战avi"]; var p = new Person(); p.hobby.push("打鸟"); alert(p.hobby); var p2 = new Person(); alert(p2.hobby); |
5.直接用Object对象或函数对象加属性与方法
|
1直接用Object对象,再去定义属性和方法 var obj = new Object(); obj.name="齐航"; obj.age = 18; obj.北京市=["海淀","昌平","东城"]; obj["朝阳市"] = ["朝北","朝东","朝西"]; obj.showInfo = function (){ alert(obj.name+","+obj.age+","+obj.朝阳市.join("~~~~~~~")); } //调用 obj.showInfo(); |
|
//先定义函数对象,再去定义属性和方法 function Person(){ } var p = new Person(); p.name="齐航"; p.age = 18; p.北京市=["海淀","昌平","东城"]; p["朝阳市"] = ["朝北","朝东","朝西"]; p.showInfo = function (){ alert(p.name+","+p.age+","+p.朝阳市.join("~~~~~~~")); } //调用 p.showInfo(); |
6 JSON数据
//json主要作用是一种当前最流行的数据交换格式
//新浪开放平台http://sina.com/dsfs/sdfs/sdddfds----->json
//在于解析方便,而且传输数据量少
|
1.json对象<-----数据库表 var p = { name:"张杰", age:29, sex:"男", showInfo:function() { alert(this.name+","+this.age); } }; //2.json数组 var list = [{name:"张杰",age:29,sex:"男"},{name:"张杰2",age:22,sex:"男2"},{name:"张杰3",age:23,sex:"男3"}]; alert(p.name+","+p.age+","+p.sex); alert(list[1].name); p.showInfo(); |
7. 方法的继承和重写
|
/要使用原型来进行模拟 function Person(){ this.name="郑志强"; this.age = 20; this.showInfo = function(){ alert("hello"); } } function Student(){ this.score = 100; } var p = new Person(); //继承 Student.prototype = p;//继承 //重写 Student.prototype.showInfo = function(){ alert(this.name+","+this.age+","+this.score); } var stu = new Student(); stu.showInfo(); p.showInfo();//也是重写之后的方法 |
|
----------------------重载(分而治之)--------------------------------- |
|
function add2(x,y){ return x+y; } function add3(x,y,z){ return x+y+z; } function add4(x,y,z,q){ return x+y+z+q; } //同名的函数只会调用最后一个函数 function add(){ if(arguments.length==2){ return add2(arguments[0],arguments[1]); } else if(arguments.length==3){ return add3(arguments[0],arguments[1],arguments[2]); }else if(arguments.length==4){ return add4(arguments[0],arguments[1],arguments[2],arguments[3]); }else{ return "你有病,不支持!!"; } } // var result = add(10); // var result = add(10,20,30,40,50); var result = add("dfds10","fsdfdsf20"); // var result = add(10,20,30); // var result = add(10,20,30,40); alert(result); |
8.with 与forin 语句
|
with语句与for..in语句 function Person(){ this.name = "刘岳林"; this.age = "20"; this.showInfo = function(){ alert(this.name+","+this.age); } } var p = new Person(); alert(p.name); alert(p.age); p.showInfo(); //with语句,用于指定要访问的对象是谁 var p = new Person(); with(p){ alert(name); alert(age); showInfo(); } |
|
For in for..in用于访问对象的属性和方法 var p = new Person(); for(var i in p){ if(p[i] instanceof Function){ p[i]();//调用方法 } else{ alert(p[i]); } } |
AJAX学习前奏----JS基础加强的更多相关文章
- 9.29学习的js基础
js基础 1.三种js引入方式 a).<input type="button" value="点击事件" onClick="documen ...
- 使用eclipse初步学习vue.js基础==》v-for的使用 ②
一.步骤演示 1. 新建一个jsp文件 2. 把vue.js放到Web的js目录下 3. 在jsp中引入vue.js <script src="${pageContext.reques ...
- 1. JavaScript学习笔记——JS基础
1. JavaScript基础 1.1 语法 严格区分大小写 标识符,第一个字符可以是 $,建议使用小驼峰法, 保留字.关键字.true.false.null不能作为标识符 JavaScript是用U ...
- (初学JS)JS基础——ATM机终端程序编写<1.0>
初步学习了JS基础,为了更好地将所学知识熟练运用,我进行了银行ATM存取款机的模拟程序编写,主要通过VScode终端实现系列操作. 我的ATM程序包括6个主要功能:1.查询余额 2.存钱 3. 取钱 ...
- JS基础学习——对象
JS基础学习--对象 什么是对象 对象object是JS的一种基本数据类型,除此之外还包括的基本数据类型有string.number.boolean.null.undefined.与其他数据类型不同的 ...
- JS基础学习——闭包
JS基础学习--闭包 什么是闭包 闭包的定义如下,它的意思是闭包使得函数可以记住和访问它的词法范围,即使函数是在它声明的词法范围外执行.更简单来讲,函数为了自己能够正确执行,它对自己的词法范围产生闭包 ...
- JS基础学习——作用域
JS基础学习--作用域 什么是作用域 变量的作用域就是变量能被访问到的代码范围,比如在下面的这个js代码中,变量a的作用域就是函数foo,因此在全局作用域内的console.log(a)语句不能访问到 ...
- JS基础学习1
1 JS 概述 一个完整的javascript实现是由以下3个不同部分组成的: (1) 核心(ECMAscript) (2) 文档对象模型(DOM) Document object ...
- 【JS基础语法】---学习roadmap---6 parts
JS基础语法---roadmap Part 1 - 2: Part 3 - 4: Part 5 - 6
随机推荐
- html5 canvas元素使用(一)
html5新增了一个canvas元素,用于在网页上生成一块矩形区域,用于绘制图像,功能非常强大,下面我来简单介绍一下 在页面中添加canvas <canvas id="canvasDe ...
- 在STEP7 TIA PORTAL中,设置模块的地址和设备名(Device name)
assign device name, ip address for PROFINET componet in TIA Portal 方法1: PLC --> online & diag ...
- unity3d在菜单栏,一键设置Player setting及自动打包并设置apk的存储位置
项目进行中,领导要求能够进行一键设置Player settings及自动打包并设置apk的位置,所以自己就上网搜索了很多大神的文章.最后是完成了领导需要的功能,在这里记录并分享一下(此项指针对安卓ap ...
- 【2017集美大学1412软工实践_助教博客】团队作业9——测试与发布(Beta版本)
题目 团队作业9--测试与发布(Beta版本)(http://www.cnblogs.com/happyzm/p/6917253.html) 团队作业9-1 测试与发布成绩 分值 1 0.5 0.5 ...
- 201521123006 《Java程序设计》第1周学习总结
1. 本章学习总结 (1)java在使用的过程中可以发现其本身有着许多为了节约资源而作的设计,而java根据其应用领域分为了三大平台:Java SE.Java ME与Java EE.在本周的学习中我们 ...
- 201521123067《Java程序设计》第1周学习总结
1.本周学习总结 在本周的java学习中,我知道了java的发展历程,JDK和JRE以及JVM的区别与联系,并学习了如何安装Eclipse和搭建java的环境,编写出了第一个java程序,明白了jav ...
- 解决"应用程序无法启动,因为应用程序的并行配置不正确"问题
想必不少人都会遇到题目中的问题.我在一次和舍友一起重装系统的时候变遇到了上述的问题, 经过仔细分析发现电脑会出现上述问题所必要的条件 系统中没有存在合理的运行库文件 所运行的软件是之前重装系统之间留下 ...
- Java-高效地使用Exception-实践
注:本文翻译自Exceptional practices,共分为3节.该文章从实践的角度非常透彻地解释了为什么要处理异常,以及如何处理异常.这些都是那些只会介绍trycatchfinally语法的教材 ...
- 手写Maven的archetype项目脚手架
一.背景 maven是一个很好的代码构建工具,采用“约定优先于配置”的原则进行项目管理,相信很多的java开发者应该都了解maven并可能在工作当中都是通过maven来管理项目的,在创建的项目的时候, ...
- Geronimo tomcat: 在 Apache Geronimo 插件体系中将 Apache Tomcat 这个优秀的 Web 容器整合至其中
Apache Geronimo 灵活的插件体系将 Tomcat, OpenJPA, OpenEJB, ActiveMQ 等第三方组件集成至其中.本文从多角度介绍了在 Apache Geronimo 中 ...