js的成员属性和原型属性的区别

2026-08-31

JavaScript面向对象(二)——成员属性、静态属性、原型属性与JS原型链

前言 JRedu 上一篇博客中,我们介绍了JS中的面向对象,并详细的解释了this的指向问题.本篇博客,我们继续来学习JS的面向对象.来深入理解一下JavaScript OOP中的成员属性/方法.静态属性/方法.原型属性/方法,并且一起来探讨一下JS中的原型与原型链. 一成员属性与成员方法在构造函数中,通过this.属性声明.或者实例化出对象后,通过“对象.属性”追加的.都属于成员属性.或成员方法:也叫实例属性与实例方法成员属性/方法,是属于实例化出的这个对象.通过"对象.属性&q

js实例属性和原型属性

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>测试文档</title> <script type="text/javascript"> // 实质上属性和方法是一样的,方法是属性为引用型的函数. //一个对象有4种属性: // 1,构造函数通过this关键

对JavaScript中的静态属性和原型属性的理解

首先是在访问上的区别,当访问实例对象的某个属性但它本身没有时,它就会到原型中去查找,但不会去查找静态属性. // 实例对象不会去查找静态属性 function Foo(){} Foo.a = 1; var foo = new Foo(); foo.a // undefined // 当实例对象没有某个属性时,会尝试去原型中查找 function Foo(){} Foo.prototype.a = 1; var foo = new Foo(); foo.a // 1 静态方法中的this指向调用它

js变量定义提升、this指针指向、运算符优先级、原型、继承、全局变量污染、对象属性及原型属性优先级

原文出自:http://www.cnblogs.com/xxcanghai/p/5189353.html作者:小小沧海题目如下: function Foo() { getName = function () { alert (1); }; return this; } Foo.getName = function () { alert (2);}; Foo.prototype.getName = function () { alert (3);}; var getName = function

【JavaScript】变量定义提升、this指针指向、运算符优先级、原型、继承、全局变量污染、对象属性及原型属性优先级

参考资料http://caibaojian.com/toutiao/5446 1.所有变量声明(var)或者声明函数都会被提升到当前函数顶部关于函数表达式,js会将代码拆分为两行代码分别执行.这里需要注意的是 var getName 和 function getName都是声明语句,区别在于var getName是函数表达式,function getName是函数声明,这里使用var进行函数声明和变量声明时一样的,都是声明提前至当前函数最顶部,二函数声明是将函数声明提升至当前函数顶部.(这个有

JS中关于构造函数、原型链、prototype、constructor、instanceof、proto属性

在Javascript不存在类(Class)的概念,javascript中不是基于类的,而是通过构造函数(constructor)和原型链(prototype chains)实现的.但是在ES6中引入了Class(类)这个概念,作为对象的模板.通过class关键字,可以定义类.基本上,ES6的class可以看作只是一个语法糖,它的绝大部分功能,ES5都可以做到,新的class写法只是让原型对象的写法更加清晰.更像面向对象编程的语法而已. 1.构造函数的简单介绍构造函数就是提供了一个生成对象的模

JS Foo.getName笔试题解析，杂谈静态属性与实例属性，变量提升，this指向，new一个函数的过程

壹 ❀ 引 Foo.getName算是一道比较老的面试题了,大致百度了一下在17年就有相关文章在介绍它,遗憾的是我在19年才遇到,比较奇妙的是现在仍有公司会使用这道题.相关解析网上是有的,这里我站在自己的理解做个记录,也算是相关知识的一次复习,题目如下,输出过程也直接标出来了: function Foo() { getName = function () { console.log(1); }; return this; }; Foo.getName = function () { conso

JavaScript之面向对象学习二(原型属性对象与in操作符)获取对象中所有属性的方法

1.原型属性对象于in操作符之in单独使用有两种方式使用in操作符:单独使用和在for-in循环中使用.在单独使用中,代码如下: function Person(){ } Person.prototype.name="张三"; Person.prototype.age=22; Person.prototype.job="coder"; Person.prototype.sayName=function(){ alert(this.name); } var pers

js继承中，原型属性的继承探究

最近研究了js的继承,看了幻天芒的文章http://www.cnblogs.com/humin/p/4556820.html#3947420,明白了最好是使用apply或call方法来实现继承. 已知,call可以将function里的属性(所谓构造属性)赋给子类:但是对于call能不能将function的prototype内容(所谓的原型属性)一同复制,有疑惑,实验之后发现是不行的.看下面的代码: g()是f()的原型中的方法. c是f子类e的一个实例,ff是f的一个实例. ff.g()系统不

JS内置对象的原型不能重定义？只能动态添加属性或方法？

昨天马上就快下班了,坐在我对面的同事突然问我一个问题,我说“爱过”,哈哈,开个玩笑.情况是这样的,他发现JS的内置对象的原型好像不能通过字面量对象的形式进行覆盖, 只能动态的为内置对象的原型添加属性或方法,下面那个具体的例子说明: var arr=[]; Array.prototype={ push:function(){ alert("); } }; arr.push(); //没有任何输出有人可能会说了“你先定义的arr,后来又修改了Array.prototype,这时Array.prot

js 对象方法、类方法、原型方法的区别;私有属性、公有属性、公有静态属性的区别

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>test</title> </head> <body> <script> //对象构造函数 function Atest(name){ //私有属性,只能在对象构造函数内部使用 var class

js判断对象的属性是原型的还是实例的

一些情况下,我们需要知道对象的属性是原型的还是实例的,如果看代码的话比较繁琐,下面讲解下如何可以直接判断 1.hasOwnProperty()函数用于指示一个对象自身(不包括原型链)是否具有指定名称的属性.如果有,返回true,否则返回false. 2.(属性名称 in 对象) 不管属性是原型的还是实例的,只要存在就返回ture否则返回false 那么我们可以利用这两个方法做一个对比,如果实例中没有且存在了这个属性,那么就是原型的首先创建一个空的对象且给对象添加一些原型属性和方法那么如何

js - 构造函数-静态属性/方法-原型对象 - 前端第八课

先来个普通对象 var duixiang={ a:"111", b:function (s) { return s+"886"; } }; console.log(duixiang.a); console.log(duixiang.b(duixiang.a)); 来一个构造函数,有this关键字 var constructor=function () { this.a="ok"; this.outlet=function(s){ return t

js中如何判断属性是对象实例中的属性还是原型中的属性

ECMAScript5中的hasOwnProperty()方法,用于判断只在属性存在与对象实例中的时候,返回true,in操作符只要通过对象能访问到属性就返回true. 因此只要in操作符返回true而hasOwnProperty()返回false,就可以确定属性是原型中的属性. 所以有如下函数: function hasPrototypeProperty(obj, name) { return !obj.hasOwnProperty(name) && (name in obj); } 当

JScript中的prototype(原型)属性研究

今天看到同事使用js中的Prototype,感觉很是新鲜.由此想深入学习一下prototype(英['prəʊtətaɪp] 美['protə'taɪp]n. 原型:标准,模范),在学习prototype(原型)之前直接给出模仿同事代码写出的测试案例. 案例: <html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title&

JS中Array数组的三大属性用法

原文:JS中Array数组的三大属性用法 Array数组主要有3大属性,它们分别是length属性.prototype属性和constructor属性. JS操作Array数组的方法及属性本文总结了Array数组的3个属性,length属性.prototype属性.constructor属性使用,并附注Array数组对象的8个分类及多个方法使用,具体如下: 对象的3个属性 1.length属性 length属性 Length属性表示数组的长度,即其中元素的个数.因为数组的索引总是由0开始,所以

java基础64 JavaScript中的Arrays数组对象和prototype原型属性（网页知识）

1.Arrays数组对象的创建方式方式一: var 变量名=new Array(); //创建一个长度为0的数组. 方式二: var 变量名=new Array(长度); //创建一个指定长度的数组对象方式三: var 变量名=new Array("元素1","元素2".......);//注意:这里是“小括号”,而不是“花括号”.和java不一样方式四: var 变量名=["元素1","元素2","元素3&q

javascript的基础知识及面向对象和原型属性

自己总结一下javascript的基础知识,希望对大家有用,也希望大家来拍砖,毕竟是个人的理解啊 1.1 类型检查:typeof(验证数据类型是:string) var num = 123; console.log(typeof num); // 1.2 in 运算符作用:判断指定属性是否存在于指定的对象中. 如果指定的属性存在于指定的对象中,则 in 运算符会返回 true. 语法: 属性 in 对象返回值:true 或者 false 示例: var obj = { age: 18 };

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

js中的caller和callee属性

caller返回一个对函数的引用,该函数调用了当前函数. functionName.caller functionName 对象是所执行函数的名称. 说明对于函数来说,caller 属性只有在函数执行时才有定义. 如果函数是由 Javascript 程序的顶层调用的,那么 caller 包含的就是 null .下面的例子说明了 caller 属性的用法: js 代码: function callerDemo() { if (arguments.caller) { var a = callerDe

js的成员属性和原型属性的区别

热门专题