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. makefile使用.lds链接脚本以及 $@ ,$^, $,< 解析

    先来分析一个简单的.lds链接脚本 例1,假如现在有head.c init.c nand.c main.c这4个文件: 1.1 首先创建链接脚本nand.lds: SECTIONS { firtst ...

  2. Spring上传文件,图片,以及常见的问题

    1. 在工程依赖库下添加文件上传jar包 commons-fileupload-1.2.2.jar commons-io-2.4.jar 2.在springMVC配置文件中配置视图解析multipar ...

  3. 查看numpy.ndarray的数据类型

    使用ndarray数据时,如果希望知道数据的类型和维数,可以按照以下方法: Xxx.dtype  #xxx表示一个ndarray类型的变量,返回ndarray的数据类型 Xxx.shape  #xxx ...

  4. Vuforia开发完全指南---Vuforia概述

    Vuforia概述 AR(Augmented Reality)增强现实,想必大家都已经很熟悉了.这是当下最热的技术之一,是利用计算机视觉和计算机图像学领域的相关知识将虚拟世界融入到现实生活当中.AR和 ...

  5. Python并发编程协程(Coroutine)之Gevent

    Gevent官网文档地址:http://www.gevent.org/contents.html 基本概念 我们通常所说的协程Coroutine其实是corporate routine的缩写,直接翻译 ...

  6. 软工+C(2017第4期) Alpha/Beta换人

    // 上一篇:超链接 // 下一篇:工具和结构化 注:在一次软件工程讨论课程进度设计的过程中,出现了这个关于 Alpha/Beta换人机制的讨论,这个机制在不同学校有不同的实施,本篇积累各方观点,持续 ...

  7. JAVA基础第五组(5道题)

    21.[程序21] 题目:求1+2!+3!+...+20!的和 1.程序分析:此程序只是把累加变成了累乘. 思路:用递归的思想. package com.niit.homework1; import ...

  8. 201521123114 《Java程序设计》第6周学习总结

    1. 本章学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 2. 书面作业 Q1.clone方法 1.1 Object ...

  9. 201521123004《Java程序设计》第4周学习总结

    1. 本周学习总结 1.1 尝试使用思维导图总结有关继承的知识点. 1.2 使用常规方法总结其他上课内容. 本周主要内容为: 继承:extends 抽取共同特征(行为与属性) 复用代码 继承时子类将获 ...

  10. 201521123038 《Java程序设计》 第十四周学习总结

    201521123038 <Java程序设计> 第十四周学习总结 1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多数据库相关内容. 接口: DriverManager ...