函数的原型链

function HotTag(parent){
//自动执行初始化(xxx,xxx)
this.init(parent);//this--->remen remen.init()
//remen--->remen.__proto__(HotTag.prototype)
//return this;
}
//初始化
HotTag.prototype.init=function(parent){
//this-->remen(HotTag的实例)
//1、初始化页面
this.initDom(parent);//remen.__proto__
//2、绑定事件
this.bindEvents();//HotTag.prototype.bindEvent
};
HotTag.prototype.initDom=function(parent){
//this--->remen
//作为热门标签的容器
var div=document.createElement("div");
div.className="hottag-container";

var h1=document.createElement("h1");
h1.innerText="热门标签";

var h3=document.createElement("h3");
h3.innerText="内容。。。。。。。。。。";

div.appendChild(h1);
div.appendChild(h3);

parent.appendChild(div);

//将功能的容器作为对象的属性(目的:在其他方法中可以访问到容器-->可以访问到容器里面

的元素)
this.container=div;//设置remen对象的自有属性container
};
//绑定事件
HotTag.prototype.bindEvents=function(){
//this-->remen

this.container.querySelector("h1").onclick=function(){
alert("点击了热门标签");
};
this.container.querySelector("h3").onclick=function(){
alert("点击了内容");
};
};

var remen=new HotTag(document.body);

函数的创建
//声明式
function f1(){} //new Function()
//函数表达式
var f2=function(){}; //new Function()

//创建一个无参无返回值的函数
var f3=new Function("var a=10;a++;console.log(a);console.log(‘你还好吗?‘)");

//创建一个有一个参数的函数
var f5=new Function("num1","console.log(num1);");
//创建2个参数的函数
var f6=new Function("a","b","console.log(a+b);");

//a1,b1,c1--->a1++ b1+c1
var f7=new Function("a1","b1","c1","a1++;console.log(a1);console.log(b1+c1);");

//结论1:任何函数都是Function的实例
function foo(){}
//foo.__proto__===Function.prototype
//Function.prototype.constructor===Function
//Function--->本身就是一个函数:自己创建了自己

//Array,构造函数,原型对象

//结论2:Function.prototype继承自Object.prototype
// Function.prototype.__proto__===Object.prototype

//Function Function.prototype
//Object Object.prototype

时间: 2024-12-21 04:54:54

函数的原型链的相关文章

JavaScript 变量、函数与原型链

定义 || 赋值 1-函数的定义 函数定义的两种方式: “定义式”函数:function fn(){ alert("哟,哟!"); } “赋值式”函数:var fn = function(){ alert("切可闹!"); } @页面加载时,浏览器会对JavaScript代码进行扫描,并将 定义式函数进行预处理(类似C等的编译).[函数声明提升] 处理完再由上至下执行,遇到赋值式函数 则只是将函数赋值给一个变量,不进行预处理,待调用时才进行处理. @在定义前面调用函

JavaScript (JS) 面向对象编程 浅析 (含对象、函数原型链解析)

1. 构造函数原型对象:prototype ① 构造函数独立创建对象,消耗性能 function Person(name) { this.name = name; this.sayHello = function () { console.log("Hello,my name is " + this.name) } } var P1 = new Person("Tom"); var P2 = new Person("Jim"); P1.sayHe

通过原型链解析js函数一些难以理解的的作用域问题

基本原理 js函数在执行时,系统会创建一个隐式的属性scope,scope中存储的是函数的作用域链. 通过对这个scope的分析,就能解释JavaScript中许多难以理解的问题: 例1: function demo(){} demo(); scope属性是在函数执行时创建,如果这个函数是一个全局函数,他的scope里会保存一个Global object和一个activation object. global object保存的是全局的信息,而activition object保存的是函数内部的

js面试题知识点全解(一原型和原型链1)

1.如何准确判断一个变量是数组类型2.写一个原型链继承的例子3.描述new一个对象的过程4.zepto(或其他框架)源码中如何使用原型链知识点:1.构造函数2.构造函数-扩展3.原型规则和示例4.原型链5.instanceof 讲解: 构造函数:一般函数为大写字母开头的都是构造函数,如下: function Foo(name,age){ this.name=name this.age=age //return this }var f = new Foo('L',20) ; //构造函数形成实例,

如何理解JavaScript中的原型和原型链

首先是一张关系图,避免抽象化理解时产生的困难 Function对象 函数对象是JavaScript学习中不可避免的一部分,而且这一部分相对重要且抽象 函数的创建方式有2种: 字面量创建 var foo = function(){ console.log("test"); } new 关键字创建实例对象 //let 函数名 = new Function(“参数列表”,”函数体”); let sum = new Function("num1,num2","re

什么是作用域, 什么事闭包, 什么事原型链

什么是作用域 作用域即作用范围,在js中采用的是词法作用域,所谓的词法作用域之的是在代码编写的过程中体现出来的作用范围,代码一旦写好,不用执行作用范围就已经决定了,这个就是词法作用域 在js中作用域的规则, * 函数运行访问函数外的数据 * 在整个代码中只有函数可以限定作用域 * 首先需要考虑提升规则 * 如果当前作用域中已经有名字,就不再考虑函数外的名字(就近原则) # 作用域链 1. 在js中只有函数可以制造作用域,只要有代码就会有一个作用域即全局作用域,凡是代码中有函数那么这个函数就构成了

web前端安全-JavaScript 原型链污染

0x01 前言 最近看到一篇原型链污染的文章,自己在这里总结一下 0x02 javascript 原型链 js在ECS6之前没有类的概念,之前的类都是用funtion来声明的.如下 可以看到b在实例化为test对象以后,就可以输出test类中的属性a了.这是为什么呢? 原因在于js中的一个重要的概念:继承. 而继承的整个过程就称为该类的原型链. 在javascript中,每个对象的都有一个指向他的原型(prototype)的内部链接,这个原型对象又有它自己的原型,直到null为止 functio

JavaScript-原型&原型链&原型继承&组合函数

小小的芝麻之旅: 今天学习了js的原型,要说原型,我们先简单说一下函数创建过程. 原型 每个函数在创建的时候js都自动添加了prototype属性,这就是函数的原型,原型就是函数的一个属性,类似一个指针.原型在函数的创建过程中由js编译器自动添加. <script type="text/javascript"> function Flower(name,area) { this.name=name; this.area=area; this.showName=myName;

JS高级(三)--原型链、闭包、作用域、函数的四种调用方式

一.原型链(家族族谱) 概念:JS里面的对象可能会有父对象,父对象还会有父对象,.....祖先 根本:继承 属性:对象中几乎都会有一个__proto__属性,指向他的父对象 意义:可以实现让该对象访问到父对象中相关属性 根对象:Object.prototype var arr=[1,3,5] arr.__proto__:Array.prototype arr.__proto__.__proto__就是找到了根对象 function Animal(){} var cat=new Animal();