原型

原型,原型链,继承

最近在看js高级程序设计,以前对prototype不了解,重新看完书后得到了很多东西不止是原型这块知识点,还有一些细节点,写法上的性能优化、一些方法的处理机制,这里就不说明了。就来把自己所知道的原型来梳理一下吧

一丶原型是什么

  • 在js里,万物皆对象,Function也是对象,在使用字面量创建基本类型的时候也会实例化成一个对象。 我们在创建对象的时候可以看到,对象里会有一个属性__proto__,可称为隐式原型。

  • 在函数(Function)这个对象中,还有一个特有的属性,prototype(显式原型)。函数的prototype是一个指针,指向一个对象。

function a(){};
a.prototype={};
new a().__proto__ === a.prototype; //true

这里就能知道一个对象的隐式原型指向和构造该对象的构造函数的原型的指向是一样的,这样就保证了能够访问到构造函数原型时定义的方法了。在对象__proto__属性里能看到里面有许多的方法还有一个属性constructor,指向我们的构造函数。

二丶继承

js没有现有的继承的机制,但是可以通过其他的方式来实现继承,比如常见的类式继承,利用原型的特性实现继承

1.类式继承

function SuperClass(){
  this.val=true    
};
SuperClass.prototype.getVal=function(){
  console.log(this.val)
}
SuperClass.prototype.o={
  a:1
}

function SubClass(){
  this.val=false
}

SubClass.prototype=new SuperClass();
SubClass.prototype.constructor=SubClass;
var sub1=new SubClass();
sub1.getVal(); //false;
sub1.o.a=2;

console.log(new SubClass().o.a)//2

类的原型对象的作用就是为类的原型添加共有方法。当子类的原型对象指向实例化一个父类的时候,再去实例化这个子类的时候,实例化后的对象里的__proto__就是我们父类的prototype对象,所以就能够访问到父类原型对象的方法和构造属性了。
但是有个缺点,因为prototype是指向对象,对象和基本值不一样,是引用,所以我们更改其中的属性也就是相当于更改父类的属性,就会相互影响。
当然也可以通过父类的原型对象for-in循环复制到子类里,只要加上hasownproperty的判断就好啦。

2.构造函数继承

js是灵活的,我们可以使用其他继承方式来解决引用问题,比如常见的构造函数继承

function SuperClass(){
  this.val=true;
  this.o={
    a:1    
 }
};

function SubClass(){
  SuperClass.call(this)
}

var sub1=new SubClass();
sub1.val//true
sub1.o.a=2

var sub2=new SubClass();
console.log(sub2.o.a)//1

当我们实例化子类的时候,执行一遍父类的函数,利用call函数更改为子类的作用域,那么在this添加属性的时候就会对子类的实例化对象添加属性了,这样创建的实例就会单独拥有一份属性了,而不能共用,
这样就违背了代码复用的原则。

3.组合继承

所以结合前两种模式的优点,就有了组合继承。

more >>

回流与重绘

Reflow和Repaint的基本认识

重绘(repaints)是一个元素外观的改变所触发的浏览器行为,例如改变vidibility,color等,重绘并不一定会导致回流

回流(reflow) 指的就是浏览器为了重新渲染部分或者全部文档而重新计算元素的位置和几何结构过程,就比如砍掉某节点元素或者改变位置或者大小也可能会造成父级元素以及子元素也产生回流

重绘的代价是高昂的,因为浏览器必须验证DOM树上其他节点元素的可见性,回流更是性能的关键,某一块元素的变化可能会造成部分区域或者整个页面的布局发生变化

所以我们在写js或者css的时候需要尽量把回流对性能的影响降到最低

dom优化

1.在修改元素样式的时候,通过修改classname名获取样式,也就是多次dom修改合并成一次

dom.style.color='#cccccc';
dom.style.top='10px';

////

dom.className='m';
.m{
color:#cccccc;
top:10px;
}

我们会用dom碎片进行组合再添加到整个dom上,因为这样仅导致一个回流。所以,style属性设置也一样会导致回流,避免设置多级内联样式。当元素获取外部类的样式时只会产生一次回流。

2.动画效果的position值为fixed或者absolute
动画效果在移动过程不会影响其他元素布局,不会导致其他元素的回流

more >>

数制

数制

数制是用一组固定的数宇和一套统一的规则来表示数的方祛。数值的计算一般都是近位计算。按照进位的规则进行计数的数制,称为进位计数制。常见的进位计数制有二进制,八进制,十六进制,十进制就是我们生活当中通用的数制,满十进一

进位计数制有两个基本要素:基数和权。

基数

基数是指某进位计数制中允许使用的数字的个数。

  • 二进制基数就是2,八进制基数就是8
  • 大于10的基数当单个数字超过9的时候会用其他符号表示,例如在十六进制中10用a表示,直到F(15)

以基数为底,以某一数字所在位置的序号为指数的幂,称为该数字在该位置的权。

以十进制数123.45来说每个数字的权都不同

  • 小数点从左往右边的权分别为10(基数)^0,10^1,10^2
  • 小数点从左往右边的权分别为10^-1,10^-2

数制计算方法

在c语言中,为了表示一个数字为八进制,会在其加个前缀0,比如050就表示42,前缀0X代表十六进制数字

more >>

字符编码

字符编码

ASCII码

在计算机内部,所有的信息最终都表示为一个二进制的字符串。每一个二进制位(bit)有0和1两种状态,因此八个二进制位就可以组合出256种状态,这被称为一个字节(byte)。也就是说,一个字节一共可以用来表示256种不同的状态,每一个状态对应一个符号,就是256个符号,从0000000到11111111。

Unicode

世界上存在着多种编码方式,同一个二进制数字可以被解释成不同的符号。因此,要想打开一个文本文件,就必须知道它的编码方式,否则用错误的编码方式解读,就会出现乱码。为什么电子邮件常常出现乱码?就是因为发信人和收信人使用的编码方式不一样。

more >>

my name is Hazlank,it have some means?no no no,sb,it just have means for me