在开始之前,必须要知道的是:对象具有__proto__.constructor(函数也是对象固也具有以上)属性,而函数独有prototype 在博客园看到一张图分析到位很彻底,这里共享: 刚开始看这图很懵,根本看不懂,但是细品,多品后恍然大悟,然后总结出以下几点,很重要切记 1.切记:对象的内置属性__proto__一定指向的是它构造函数的原型对象 2.切记:对象的内置属性__proto__.__proto__一定指向Object原型对象(Object.prototype) 3.切记:对象的内置…

作为一名前端工程师,必须搞懂JS中的prototype.__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间的关系并彻底搞懂它们.这里说明一点,__proto__属性的两边是各由两个下划线构成(这里为了方便大家看清,在两下划线之间加入了一个空格:_ _proto_ _),本文基于谷歌浏览器(版本 72.0.3626.121)的实验结果所得.   现在正式开始! 让我们从如下一个简单的例子展开讨论,并配以相关的图帮助理解…

彻底搞懂 JS 中 this 机制 摘要:本文属于原创,欢迎转载,转载请保留出处:https://github.com/jasonGeng88/blog 目录 this 是什么 this 的四种绑定规则 绑定规则的优先级 绑定例外 扩展:箭头函数 this 是什么 理解this之前, 先纠正一个观点,this 既不指向函数自身,也不指函数的词法作用域.如果仅通过this的英文解释,太容易产生误导了.它实际是在函数被调用时才发生的绑定,也就是说this具体指向什么,取决于你是怎么调用的函数. th…

让你彻底搞懂JS中复杂运算符== 大家知道,==是JavaScript中比较复杂的一个运算符.它的运算规则奇怪,容易让人犯错,从而成为JavaScript中“最糟糕的特性”之一. 在仔细阅读了ECMAScript规范的基础上,我画了一张图,我想通过它你会彻底地搞清楚关于==的一切.同时,我也试图通过此文向大家证明==并不是那么糟糕的东西,它很容易掌握,甚至看起来很合理. 图1: ==运算规则的图形化表示 ==运算规则的精确描述在此:The Abstract Equality Comparison…

一文搞懂 js 中的各种 for 循环的不同之处 See the Pen for...in vs for...of by xgqfrms (@xgqfrms) on CodePen. for "use strict"; /** * * @author xgqfrms * @license MIT * @copyright xgqfrms * @created 2020-07-01 * @modified * * @description for : var hoisting, brea…

原生的原型链 function fn(){},fn 为 Function的一个实例,原型链为 null -> Object -> Function -> fn: fn.__proto__ === Function.prototype Function.prototype.__proto === Object.prototype Object.prototype.__proto__ === null 原型链通过原型(prototype)链接,prototype 就是一个 只有(构造)函数才…

JavaScript中实现继承的6种方案 01-原型链的继承方案 function Person(){ this.name="czx"; } function Student(){} var p1=new Person(); Student.prototype=p1; var student1=new Student(); console.log(student1); // Person{} console.log(student1.name); // czx 这是最简单的一种方案,同…

基础 typeof 运算符是 javascript 的基础知识点,尽管它存在一定的局限性(见下文),但在前端js的实际编码过程中,仍然是使用比较多的类型判断方式. 因此,掌握该运算符的特点,对于写出好的代码,就会起到很大的帮助作用. typeof 返回一个字符串,表示该操作值的数据类型,基本语法: typeof operand typeof(operand) 可能返回的类型字符串有:string, boolean, number, bigint, symbol, undefined, funct…

大家知道,JavaScript中的==是一种比较复杂运算,它的运算规则很奇怪,很容易让人犯错,从而成为JavaScript中“最糟糕的特性”之一. 在仔细阅读ECMAScript规范的基础上,我画了一张图,我想等你理解了这张图后,会彻底地弄懂关于==运算的一切.同时,我试图通过此文向大家证明==并不是那么糟糕的东西,它很容易掌握,甚至看起来很合理,并没那么糟糕. 先上图: 图1 == 运算规则的图形化表示 ==运算规则的精确描述在此:The Abstract Equality Compariso…

晨叔周刊,每周一话题,技术天天涨. 本周的话题是JS的内存问题(加入本周话题,请点击传送门). 图 话题入口 今天的技术晨报来,就来谈谈JS中变量的,值传递和引用传递的问题.现在,对于很多的JSer来讲,基本不关心堆和栈的问题,代码照样666. 但是,现在的前端,不再是传统的JQ时代,而是MVVM,组件化,工程化.前端的承载着复杂业务逻辑.为此,内存问题,成为JSer必须要考虑的问题. 本文从堆栈讲起,让大家理解JS中变量的内存使用以及变动情况 . 一.初步了解堆栈  先初步了解JS中的堆和栈,…

js小数运算会出现精度问题 js number类型 JS 数字类型只有number类型,number类型相当于其他强类型语言中的double类型(双精度浮点型),不区分浮点型和整数型. number类型不同进制 number 有四种进制表示方法,十进制,二进制,八进制和十六进制 表示方法 二进制: 0B或者0b (数字0和字母B或者小写字母b) ,后接1或者0表示二进制数 八进制: es5下禁止表示八进制数会自动转化为十进制数,es6用0o ,后接小于8的数字表示八进制 十六进制: 以0x或者0…

在这里必须要提一句的是,this指向是学习js必须要掌握的(必须),再开始之前先看底部的总结,然后回上面看例子便一目了然. 例子1: function a(){ var user = "TangSir"; console.log(this.user); //undefined console.log(this); //Window } a();看总结第2条,这里函数本身没有被父级对象调用,那么这里就指向window function a(){ var user = "Tang…

码文不易,转载请带上本文链接,感谢~ https://www.cnblogs.com/echoyya/p/14577243.html 目录 码文不易,转载请带上本文链接,感谢~ https://www.cnblogs.com/echoyya/p/14577243.html Script 标签 CommonJS规范(同步加载模块) 创建模块 加载模块 导出模块 CommonJS 特点 AMD(Asynchronous Module Definition) 创建模块 加载规范模块 加载非规范的模块…

== 运算的规则: undefined == null,结果是true.且它俩与所有其他值比较的结果都是false. String == Boolean,需要两个操作数同时转为Number. String/Boolean == Number,需要String/Boolean转为Number. Object == Primitive,需要Object转为Primitive(具体通过valueOf和toString方法). 原文链接:https://zhuanlan.zhihu.com/p/2165…

作为一名前端工程师,必须搞懂JS中的prototype.__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间的关系并彻底搞懂它们.这里说明一点,__proto__属性的两边是各由两个下划线构成(这里为了方便大家看清,在两下划线之间加入了一个空格:_ _proto_ _).   现在正式开始!让我们从如下一个简单的例子展开讨论,并配以相关的图帮助理解: function Foo() {...};let f1 = new…

1.前言 作为一名前端工程师,必须搞懂JS中的prototype.__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间的关系并彻底搞懂它们.这里说明一点,__proto__属性的两边是各由两个下划线构成(这里为了方便大家看清,在两下划线之间加入了一个空格:_ _proto_ _),实际上,该属性在ES标准定义中的名字应该是[[Prototype]],具体实现是由浏览器代理自己实现,谷歌浏览器的实现就是将[[Protot…

作为一名前端工程师,必须搞懂JS中的prototype.__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间的关系并彻底搞懂它们.这里说明一点,__proto__属性的两边是各由两个下划线构成(这里为了方便大家看清,在两下划线之间加入了一个空格:_ _proto_ _),本文基于谷歌浏览器(版本 72.0.3626.121)的实验结果所得.   现在正式开始! 让我们从如下一个简单的例子展开讨论,并配以相关的图帮助理解…

零.资料与前言 0x1 材料: 1.帮你彻底搞懂JS中的prototype.__proto__与constructor(图解) 0x2 前言 之前也尝试总结过 js 中的 __proto__ . prototype 以及原型链相关的资料(JS 中的原型 -- prototype.__proto__ 以及原型链),不过彼时受限于经验等因素,没有多少条理,同时也存在诸多的的疑点. 学习嘛,就是一个不断推翻自己的过程,本次总结如下: 一.总览 以下例子贯穿全文... function Foo(age)…

本文转载自:@manxisuo的<通过一张简单的图,让你彻底地.永久地搞懂JS的==运算>. 大家知道,==是JavaScript中比较复杂的一个运算符.它的运算规则奇怪,容让人犯错,从而成为JavaScript中"最糟糕的特性"之一. 在仔细阅读了ECMAScript规范的基础上,我画了一张图,我想通过它你会彻底地搞清楚关于==的一切.同时,我也试图通过此文向大家证明==并 不是那么糟糕的东西,它很容易掌握,甚至看起来很合理. 先上图: 图1 == 运算规则的精确描述在此…

这篇文章主要讲一下JS中面向对象以及 __proto__,ptototype和construcator,这几个概念都是相关的,所以一起讲了. 在讲这个之前我们先来说说类,了解面向对象的朋友应该都知道,如果我要定义一个通用的类型我可以使用类(class).比如在java中我们可以这样定义一个类: public class Puppy{ int puppyAge; public Puppy(age){ puppyAge = age; } public void say() { System.out.…

这篇文章主要讲一下JS中面向对象以及 __proto__,ptototype和construcator,这几个概念都是相关的,所以一起讲了. 在讲这个之前我们先来说说类,了解面向对象的朋友应该都知道,如果我要定义一个通用的类型我可以使用类(class).比如在java中我们可以这样定义一个类: public class Puppy{ int puppyAge; public Puppy(age){ puppyAge = age; } public void say() { System.out.…

1. JavaScript内置对象 所谓的内置对象 指的是:JavaScript本身就自己有的对象 可以直接拿来就用.例如Array String 等等.JavaScript一共有12内置对象    其中10个函数类型( String,Number,Boolean,Array,Function,Date,RegExp,Error,Object,Event )函数类型 有 __proto__和 prototype 属性 2个对象类型(Math,JSON) 对象类型只有__proto__属性. 下面…

一. Prototype.__proto__与Object.Function关系介绍 Function.Object:都是Js自带的函数对象.prototype,每一个函数对象都有一个显式的prototype属性(普通对象没有prototype),它代表了对象的原型(Function.prototype是一个对象,有constructor和__proto__两个属性,constructor指向构造函数本身,__proto__指向于它所对应的原型对象).__proto__:每个对象都有一个名为__…

                                   Object                                    1. Object是一个函数(typeof Object;//function).Object构造器创建了一个对象包装器 //Object{} var o = new Object(null); //Object{} var o = new Object(defined); //Number var o = new Object(1); //B…

看了JS的prototype和__proto__这篇文章,才感觉很清晰了,对于原型这块,以前经常把这些属性弄不清楚, 明白了之后保存下整理下: prototype: 是函数的一个属性(每个函数都有一个prototype属性) __proto__: 是一个对象拥有的内置属性 (prototype是函数的内置属性,__proto__是对象的内置属性) 二.new 的过程 var t= function(){}; var p = new t(); new的过程拆分成以下三步:(1) var p={};…

一.前言 了解JavaScript面向对象,需要先了解三个名词: 构造函数,实例对象和原型对象. 注意:JavaScript中没有类(class)的概念,取而代之的是构造函数,两者类似却又有很大的差别. 先上代码,最常用的: function Person(name, age) { this.name = name; this.age = age; this.eat= function() { alert('吃西红柿') } } var person1 = new Person('小米', 28…

一    Prototype.__proto__与Object.Function关系介绍        Function.Object:Js自带的函数对象.         prototype,每一个函数对象都有一个显示的prototype属性,它代表了对象的原型(Function.prototype函数对象是个例外,没有prototype属性).         __proto__:每个对象都有一个名为__proto__的内部隐藏属性,指向于它所对应的原型对象(chrome.firefox中名…

个人总结: 下面这篇文章很好的讲解了js原型,原型链,个人的总结是要记住这三个属性 prototype.__proto__和constructor 首先明确,js中一切都是对象object(A). (这里用A来表示) 这个对象object分为 实例对象(B)(A和B是两个不同的对象...这个意思很难表达),函数,原型这三种类型. 只要是函数就有prototype属性,它指向,这个函数的原型. 只要是对象(A)就有__proto__属性,它指向实例化这个对象的函数的原型. 只要是原型就有const…

1.基本类型不是对象(boolean.undefined.number.string) 2.引用类型都是对象(Array,function ,Object) 3.对象是通过函数创建,并且强调,对象字面量也是通过函数创建,举例说明,ES6继承的语法糖 4.函数有的是显式原型prototype 5.对象有的是隐式原型__proto__ 和构造器 constructor 6.但是由于JS中函数也是一种对象,所以函数也拥有__proto__和constructor 7.__proto__ 属性,它是对象…

我们需要牢记两点: ①__proto__和constructor属性是对象所独有的: ② prototype属性是函数所独有的,因为函数也是一种对象,所以函数也拥有__proto__和constructor属性.__proto__属性的作用就是当访问一个对象的属性时,如果该对象内部不存在这个属性,那么就会去它的__proto__属性所指向的那个对象(父对象)里找,一直找,直到__proto__属性的终点null,然后返回undefined,再往上找就相当于在null上取值,会报错.通过__pro…