JS中的实例方法、静态方法、实例属性、静态属性

一、静态方法与实例方法的例子:

我们先来看一个例子来看一下JS中的静态方法和实例方法到底是什么?

静态方法:

function A(){}

A.col=‘red‘  //静态属性

A.sayMeS=function(){

console.log("Hello World S!");

}

A.sayMeS();//输出Hello World S!

实例方法:

function A(){

this.Color="yellow"  //实例属性

}

A.prototype.age=14;  //实例属性

A.prototype.sayMeE=function(){

console.log("Hello World E!");

}

var a=new A();

a.sayMeE();//输出Hello World E!

注意:我们还有一种写法,如下:

A.prototype = new Animal();

或者

A.prototype = {
    aa:32323,
    say: function() { console.log("My color is " + this.color); }
}

这个写法,会覆盖前面的A.prototype.age  和  A.prototype.sayMeE ,所以一定要注意顺序,把这个两种写法放到前面,然后再写自己定义的

二、二者的区别:

从定义上,实例方法要用到function这个对象中的prototype属性来定义,静态方法通过A.直接定义;从方法调用上,静态方法可以直接通过A.来调用,实例方法要通过先定义一个引用变量,指向构造函数定义的新对象。

我们之前的博文已经讨论过JS对象、构造函数、原型(参看Js中的对象、构造函数、原型、原型链及继承),这里加深一下理解,我们之前已经说过函数是一个对象,函数对象中的属性 prototype可以想成一个指针,指向一个方法(这样不用每一次用构造函数创造一个新实例后都要将方法重新创建一遍)。这样就好理解了,var a是A的一个引用,也就是指针,a就可以指向sayMeE这个方法,如果直接A.sayMeE()是会报错的,因为A不是一个指针,a.sayMeS()也会报错,因为a不是一个方法对象。

三、再谈继承:

继承举例:

function A(){ }

A.prototype.sayMeE=function(){
    console.log("Hello World E!");
}

function B(){ }

B.prototype=new A();//实现了继承

继承就是将B的指针指向A对象,这种形式是用A的构造函数来构建对象。

出处:https://www.cnblogs.com/hanguidong/p/9296697.html

====================================================================

背景
之前一直以为构造函数可以直接访问原型方法,是错的,现在说一下

实例方法
构造函数中this上添加的成员 ,在Cat构造方法里面,定义在this中的变量和方法,只有实例才能访问到:如this.name,this.move,this.eat这些都是实例拥有,无法通过Cat直接调用。

function Cat(name){
this.name = name
this.move = function() {
console.log(‘移动‘)
}
this.eat = function() {
console.log(`${this.name}爱吃鱼`)
}
}
//给Cat构造函数添加静态方法
Cat.eat = function() {console.log(`${this.name}爱吃鱼`)}
let cat = new Cat(‘tom‘)
Cat.eat() //Cat爱吃鱼 //这是静态方法
Cat.move() //Cat.move is not a function
cat.eat() //tom爱吃鱼 //这是实例方法
cat.move() //移动 //这是实例方法

静态方法
构造函数本身上添加的成员

下面的Cat.eat就是构造函数的静态方法,不能通过实例调用

function Cat(name){
this.move = function() {
console.log(1)
}
}
//直接定义在Cat构造函数中,实例不能调用
Cat.eat = function() {console.log(`${this.name}爱吃鱼`)}
构造函数调用
Cat.eat() //Cat爱吃鱼
Cat.move() //Cat.move is not a function
let cat = new Cat()
cat.eat() //cat.eat is not a function
原型方法
原型中的方法实例和构造函数都可以访问到

function Cat() {
}
Cat.eat = function() {
console.log(‘静态方法‘)
}
Cat.prototype.eat = function() {
console.log(‘原型方法‘)
}
let cat = new Cat()
Cat.eat() //静态方法
Cat.prototype.eat() //原型方法,不用prototype就是打印静态方法

cat.eat() //原型方法
结论
简而言之,实例方法就是只有实例可以调用,静态方法只有构造函数可以调用,原型方法是实例和构造函数都可以调用,是共享的方法。

像Promise.all和Promise.race这些就是静态方法,Promise.prototype.then这些就是原型方法,new 出来的实例可以调用

let promise = new Promise(function(resolve, rejected) {
resolve()
}) 
promise.then() //then是原型方法

出处:https://blog.csdn.net/qq_38262910/article/details/90512130

原文地址:https://www.cnblogs.com/mq0036/p/12044420.html

时间: 2024-09-29 02:30:38

JS中的实例方法、静态方法、实例属性、静态属性的相关文章

JS中:json对象数组按对象属性排序

var array = [ {name: 'a', phone: 1}, {name: 'b', phone: 5}, {name: 'd', phone: 3}, {name: 'c', phone: 4} ] array.sort(getSortFun('desc', 'phone')); function getSortFun(order, sortBy) { var ordAlpah = (order == 'asc') ? '>' : '<'; var sortFun = new F

js中clientWidth, scrollWidth, innerWidth, outerWidth和offsetWidth属性的区别

js中clientWidth, scrollWidth, innerWidth, outerWidth,offsetWidth的属性汇总,测试浏览器:ie7~ie11.chrome 和 firefox等. 一.测试1:无滚动条时,dom对象的offsetWidth.clientWidth和scrollWidth (1)测试代码 <!DOCTYPE HTML> <html lang="zh-cn"> <head> <meta charset=&q

Java静态属性、静态方法、非静态属性、非静态方法的继承问题简单了解

package com.book.web.controller; /**  * 父类  * @author liweihan  *  */ public class Parent { public String normalStr = "父类非静态属性"; public static String staticStr = "父类静态属性"; public String changeStr = "父类-变量"; public static Stri

JS中设置按钮不可用的disabled属性

JS中可以通过document.getElementById("btn").disabled = true;来设置按钮不可用 也可以设置form表单中的textarea的disabled属性,可以让用户无法向textarea备注框内输入字符 document.getElementById("textarea").disabled = true; 带有一个禁用输入字段的 HTML 表单: <form action="form_action.asp&qu

js中组件的开发实例

一个组件开发的例子: 来源:http://www.cnblogs.com/uedqd/archive/2013/02/23/2923099.html 先上代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http:

类、实例、静态属性与方法

1 class Game(object): 2 # 定义最高分 类属性 3 top_score = 0 4 5 # 初始化 6 def __init__(self,name): 7 self.name = name 8 9 10 # 游戏帮助 静态方法 11 @staticmethod 12 def game_help(): 13 print("提示:不让僵尸进入家门") 14 15 # 最高分 类方法 16 @classmethod 17 def show_top_score(cls

js中屏幕尺寸计算的几个属性学习笔记

基本概念 document.body.clientWidth :指的是BODY对象宽度document.body.clientHeight :指的是BODY对象高度document.documentElement.clientWidth: 指的是可见区域宽度document.documentElement.clientHeight :指的是可见区域高度 window.innerHeight - 浏览器窗口的内部高度 window.innerWidth - 浏览器窗口的内部宽度 clientX/c

关于JS中变量的作用域-实例

先看问题,如下,自己运行一下吧! if (!('_qyzA' in window)) { var _qyzA = 1; } alert(_qyzA);//undefined 分析:首先,所有的全局变量都是window的属性,如var _qyzA = 1;等价于window._qyzA = 1;其次,所有的变量的声明都在作用域的顶部,如alert("_qyzA"); var _qyzA;相当于var _qyzA;alert("_qyzA");这是由于JavaScrip

python进阶三(面向对象编程基础)【3-3 python中定义实例方法】

python中定义实例方法 一个实例的私有属性就是以__开头的属性,无法被外部访问,那这些属性定义有什么用? 虽然私有属性无法从外部访问,但是,从类的内部是可以访问的.除了可以定义实例的属性外,还可以定义实例的方法. 实例的方法就是在类中定义的函数,它的第一个参数永远是 self,指向调用该方法的实例本身,其他参数和一个普通函数是完全一样的: 1 class Person(object): 2 3 def __init__(self, name): 4 self.__name = name 5