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基础加强的更多相关文章

  1. 9.29学习的js基础

    js基础 1.三种js引入方式    a).<input type="button" value="点击事件" onClick="documen ...

  2. 使用eclipse初步学习vue.js基础==》v-for的使用 ②

    一.步骤演示 1. 新建一个jsp文件 2. 把vue.js放到Web的js目录下 3. 在jsp中引入vue.js <script src="${pageContext.reques ...

  3. 1. JavaScript学习笔记——JS基础

    1. JavaScript基础 1.1 语法 严格区分大小写 标识符,第一个字符可以是 $,建议使用小驼峰法, 保留字.关键字.true.false.null不能作为标识符 JavaScript是用U ...

  4. (初学JS)JS基础——ATM机终端程序编写<1.0>

    初步学习了JS基础,为了更好地将所学知识熟练运用,我进行了银行ATM存取款机的模拟程序编写,主要通过VScode终端实现系列操作. 我的ATM程序包括6个主要功能:1.查询余额 2.存钱 3. 取钱 ...

  5. JS基础学习——对象

    JS基础学习--对象 什么是对象 对象object是JS的一种基本数据类型,除此之外还包括的基本数据类型有string.number.boolean.null.undefined.与其他数据类型不同的 ...

  6. JS基础学习——闭包

    JS基础学习--闭包 什么是闭包 闭包的定义如下,它的意思是闭包使得函数可以记住和访问它的词法范围,即使函数是在它声明的词法范围外执行.更简单来讲,函数为了自己能够正确执行,它对自己的词法范围产生闭包 ...

  7. JS基础学习——作用域

    JS基础学习--作用域 什么是作用域 变量的作用域就是变量能被访问到的代码范围,比如在下面的这个js代码中,变量a的作用域就是函数foo,因此在全局作用域内的console.log(a)语句不能访问到 ...

  8. JS基础学习1

    1 JS 概述 一个完整的javascript实现是由以下3个不同部分组成的: (1)     核心(ECMAscript) (2)     文档对象模型(DOM)  Document object ...

  9. 【JS基础语法】---学习roadmap---6 parts

    JS基础语法---roadmap Part 1 - 2: Part 3 - 4:   Part 5 - 6

随机推荐

  1. 循环checked表单 元素

    var poject_Array = "";            $('input[name="yearCardPoject"]:checked').each ...

  2. CCIE-MPLS VPN-实验手册(下卷)

    10:跨域的MPLS VPN (Option A) 10.1 实验拓扑 10.1 实验需求 a.       R1 R2 R3 组成P-NETWORK R1 R2 R3 位于AS 1,底层协议采用EI ...

  3. 转: 【Java并发编程】之十七:深入Java内存模型—内存操作规则总结

    转载请注明出处:http://blog.csdn.net/ns_code/article/details/17377197 主内存与工作内存 Java内存模型的主要目标是定义程序中各个变量的访问规则, ...

  4. Windows10 VS2015下分别编译libevent 32位和64位库

    Libevnt 在Windows10 VS2015下分别编译32位和64位库 直接上王道 libevent代码地址: https://github.com/libevent/libevent git ...

  5. About Cheating and Plagiarism

    我先描述一下此次事件的具体经过.昨天3月15号的晚上十点,是第四次作业的deadline.在15号之前,只有五位同学提交了作业,而在临近deadline的这几个小时内密密麻麻地提交了二十多份作业.和第 ...

  6. 结对编程1--基于GUI的四则运算题目生成器

    最终项目详细代码(coding地址)/李志强的博客/我的详细代码/方言的博客 一.需求分析 1.实现之前项目的功能,如:除了整数之外,还要支持真分数的四则运算,真分数的运算,并且要求能处理用户的输入, ...

  7. 如何将ubuntu文件夹中文名改为英文

    其实我已经忍了很久. ubuntu在中文界面下面,自动创建了"桌面","文档",图片 .公共的 .下载. 音乐. 视频等中文目录. 在命令行下操作的时候,要么切 ...

  8. 201521123071 《JAVA程序设计》第十周学习总结

    第十周-异常与多线程 1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常与多线程相关内容. 2. 书面作业:本次PTA作业题集异常.多线程 1. finally:题目4-2 1. ...

  9. Junit4学习(三)Junit运行流程

    一,验证Junit测试方法的流程 1,在test/com.duo.util右键,新建测试类 2,生成后的代码: package com.duo.util; import static org.juni ...

  10. 私人订制——属于你自己的Linux

    一.前言 Linux操作系统至1991年10月5日诞生以来,就其开源性和自由性得到了很多技术大牛的青睐,每个Linux爱好者都为其贡献了自己的一份力,不管是在Linux内核还是开源软件等方面,都为我们 ...