>  기사  >  웹 프론트엔드  >  js 객체와 프로토타입을 사용하는 방법

js 객체와 프로토타입을 사용하는 방법

php中世界最好的语言
php中世界最好的语言원래의
2018-06-04 18:06:181588검색

이번에는 js 객체와 프로토타입을 어떻게 사용하는지 보여드리고, js 객체와 프로토타입을 사용할 때 주의사항은 무엇인지 살펴보겠습니다.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>
    /*
     *
     * 复习:
     *
     * 面向过程和面向对象都是编程的思想,方式不一样
     * 面向过程:凡事都是亲力亲为,所有的代码都要自己写,每一步都要很清楚,注重的是过程
     * 面向对象:执行者成为指挥者,只要找对象,然后让对象做相关的事情,注重的是结果
     * 面向对象的特性:封装,继承,多态
     * 封装;就是代码的封装,把一些特征和行为封装在对象中.
     * 
面向对象的编程思想
:根据需求,抽象出相关的对象,总结对象的特征和行为,把特征变成属性,行为变成方法,然后定义(js)
构造函数
,实例化对象,通过对象调用
属性和方法
,完成相应的需求.---编程的思想
     *
     * 对象:具体特指的某个事物,有特征(属性)和行为(方法),对象可以看成是一坨无序属性的集合
     *
     * 如何
创建对象
?
     * 通过调用new Object(),还有{},自定义构造函数
     *
     * 创建对象的方式
     * 1. 调用系统Object()----->创建出来的对象都是Object类型的,不能很明确的指出这个对象是属于什么类型
     * 2. 字面量的方式{}----->只能
创建一个对象
(一次只能创建一个)
     *
     * 3.
工厂模式
创建对象----->----->推论---->自定义构造函数的方式
     *   自定义构造函数(优化后的工厂模式)
     *
     *   自定义构造函数创建对象:4件事
     *   1.在内存中申请一块空闲的空间,存储创建的对象
     *   2.this就是当前实例化的对象
     *   3.设置对象中的属性和方法(为对象添加属性和方法,为属性和方法赋值)
     *   4.把创建后的对象返回
     *   都是需要通过new的方式
     *
     *
     * 什么是原型?
     * 构造函数中有一个属性prototype,是原型,程序员使用的
     * 实例对象中有一个属性proto,是原型,浏览器使用的,不是很标准的,
     * 实例对象中的proto指向的就是该实例对象中的构造函数中的prototype
     * 构造函数中的prototype里面的属性或者方法,可以直接通过实例对象调用
     * 正常的写法:实例对象.proto才能访问到构造函数中的prototype中的属性或者方法
     * per.proto.eat();//proto不是标准的属性
     * per.eat();
     * 原型就是属性,而这个属性也是一个对象
     * Person.prototype--->是属性
     * Person.prototype.属性或者Person.ptototype.方法()
     *
     * 本身在构造函数中定义的属性和方法,当实例化对象的时候,实例对象中的属性和方法都是在自己的空间中存在的,如果是多个对象。这些属性和方法都会在单独的空间中存在,浪费内存空间,所以,为了数据共享,把想要节省空间的属性或者方法写在原型对象中,达到了数据共享,实现了节省内存空间
     *
     *
     *
     * 原型的作用之一:数据共享,节省内存空间
     *
     * 原型的写法:
     * 构造函数.prototype.属性=值
     * 构造函数.prototype.方法=值---->函数.prototype,函数也是对象,所以,里面也有proto
     * 实例对象.prototype-------->实例对象中没有这个属性,只有proto(暂时的)
     *
     * 简单的原型的写法
     * 缺陷:--->新的知识点---->原型直接指向{}---->就是一个对象,没有构造器
     * 构造函数.prototype={
     * 切记:如果这这种写法,要把构造器加上
     *
     * };
     *
     *
     * 通过原型为内置对象添加原型的属性或者方法----->原因:
     * 系统的内置对象的属性和方法可能不满足现在需求,所以,可以通过原型的方式加入属性或者方法,为了方便开发
     *
     * 为内置对象的原型中添加属性和方法,那么这个内置对象的实例对象就可以直接使用了
     * String.prototype.方法=匿名函数;
     * var str="哈哈";
     * str.方法();---->实例对象可以直接调用原型中的属性或者方法
     *
     *
     *
     *
     *
     *
     *
     *
     *
     * */
    function Person(age) {
      this.age=age;
    }
    Person.prototype.sayHi=function () {
    };
    var p=new Person(10);
    p.sayHi();
  </script>
</head>
<body>
</body>
</html>

이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

추천 도서:

JS 프레임워크 라이브러리 사용 사례에 대한 자세한 설명

네이티브 js를 사용하여 별이 빛나는 하늘 효과를 만드는 방법

위 내용은 js 객체와 프로토타입을 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.