zw_slime
zw_slime

重学前端-面向对象

对象

属性

数据属性

1.value 值

2.writable 能否被赋值

3.enumerable 能否被枚举 for in Object.keys

4.configurable 能否被删除或者改变属性值

var a ={a:1}
Object.getOwnPropertyDescriptor(a,'a') //{configurable: true,enumerable: true,value: 1,writable: true}

Object.defineProperty(a,'a',{value:5,configurable: false,enumerable: false,writable: false})

访问器属性

1.Getter 取值

2.setter 赋值

3.enumerable 能否被枚举 for in

4.configurable 能否被删除或者改变属性值

let o = {
  b: 1,
  get a() {
    return this.b;
  },
  set a(i) {
    this.b = i;
  },
};

console.log(o.a); // 1
o.a = 5;
console.log(o.a); // 5


var o = { b: 1 };
Object.defineProperty(o, 'a', {
  set: function (value) {
    this.b = value + 100;
  },
  get: function () {
    return this.b;
  },
});

console.warn(o.a); // 6
o.a = 6;
console.warn(o.a); // 106

创建对象

对象的key只能是字符串 和 symbol

对象字面量

var id = Symbol();
var o = { name: 'a', age: 18, [id]: 1 }; // 对象的key 键名是数值

console.warn(o[id]); // 1
// 获取key string
console.log(Object.getOwnPropertyNames(o)); //[ 'name', 'age' ]
console.log(Object.keys(o)); //[ 'name', 'age' ]
// 获取key Symbol
console.log(Object.getOwnPropertySymbols(o)); // [ Symbol() ]

// 获取所以属性
console.log(Object.getOwnPropertyNames(o).concat(Object.getOwnPropertySymbols(o))); // [ 'name', 'age', Symbol() ]
console.log(Reflect.ownKeys(o)); // [ 'name', 'age', Symbol() ]

// 获取属性
console.log(Object.getOwnPropertyDescriptor(o, 'name')); // { value: 'a', writable: true, enumerable: true, configurable: true }
console.log(Object.getOwnPropertyDescriptors(o));
// {
//   name: { value: 'a', writable: true, enumerable: true, configurable: true },
//   age: { value: 18, writable: true, enumerable: true, configurable: true },
//   [Symbol()]: { value: 1, writable: true, enumerable: true, configurable: true }
// }

for (let i in o) {
  console.log(i); // name age
}

console.log(o.hasOwnProperty('name')); // true
console.log(o.hasOwnProperty(id)); // true

缺点：产生大量重复代码

Object构造函数

var id = Symbol();
var o = new Object({ name: 'a', age: 18, [id]: 1 }); // 对象的key 键名是数值

console.warn(o[id]); // 1
// 获取key string
console.log(Object.getOwnPropertyNames(o)); //[ 'name', 'age' ]
console.log(Object.keys(o)); //[ 'name', 'age' ]
// 获取key Symbol
console.log(Object.getOwnPropertySymbols(o)); // [ Symbol() ]

// 获取所以属性
console.log(Object.getOwnPropertyNames(o).concat(Object.getOwnPropertySymbols(o))); // [ 'name', 'age', Symbol() ]
console.log(Reflect.ownKeys(o)); // [ 'name', 'age', Symbol() ]

// 获取属性
console.log(Object.getOwnPropertyDescriptor(o, 'name')); // { value: 'a', writable: true, enumerable: true, configurable: true }
console.log(Object.getOwnPropertyDescriptors(o));
// {
//   name: { value: 'a', writable: true, enumerable: true, configurable: true },
//   age: { value: 18, writable: true, enumerable: true, configurable: true },
//   [Symbol()]: { value: 1, writable: true, enumerable: true, configurable: true }
// }

for (let i in o) {
  console.log(i); // name age
}

console.log(o.hasOwnProperty('name')); // true
console.log(o.hasOwnProperty(id)); // true

缺点：产生大量重复代码

Object.create()

使用现有的原型来创建对象

var id = Symbol();
var o = Object.create({ name: 'a', age: 18, [id]: 1 }); // 对象的key 键名是数值

console.warn(o[id]); // 1
// 获取key string
console.log(Object.getOwnPropertyNames(o)); //[ ]
console.log(Object.keys(o)); //[  ]
// 获取key Symbol
console.log(Object.getOwnPropertySymbols(o)); // [  ]

// 获取所以属性
console.log(Object.getOwnPropertyNames(o).concat(Object.getOwnPropertySymbols(o))); // [ ]
console.log(Reflect.ownKeys(o)); // [ ]

// 获取属性
console.log(Object.getOwnPropertyDescriptor(o, 'name')); // undefined
console.log(Object.getOwnPropertyDescriptors(o)); // {}

for (let i in o) {
  console.log(i); // name age
}

console.log(o.hasOwnProperty('name')); // false
console.log(o.hasOwnProperty(id)); // false

工厂模式

function createPerson(name,age) {
    var o = new Object()
    o.name = name;
    o.age = age;
    o.sayName=function() {
        console.log(this.name)
    }
    return o
}

var p1 = createPerson('a',18)
var p2 = createPerson('b',18)

console.log(p1 instanceof Object) // true
console.log(p2  instanceof Object) // true

console.log(p2.__proto__ === p1.__proto__)

优点：能一次创建多个对象

缺点：创建的对象没法区别 所有实例的原型都指向同一个对象

构造函数模式

function Person(name,age) {
    this.name = name;
    this.age = age;
    this.sayName = function() {
        console.log(this.name)
    }
}
var p3 = new Person('a',18)
p3.sayName() // q
p3.name = 'aa'
p3.sayName() // qq
var p4 = new Person('b',18)
p4.sayName() // b
console.log(p3 instanceof Person) // true
console.log(p4 instanceof Person) // true

console.log(p4.__proto__ === p3.__proto__)

优点：显式的创建了对象 可以识别为一种特点类型
缺点：每次创建对象时方法都要被创建一次

原型模式

function Person1() {

}
Person1.prototype.name = 'a'
Person1.age = '18'
Person1.sayName = function() {
    console.log(this.name)
}
var p5 = new Person('a',18)
p5.sayName() // a
p5.name = 'aa'
p5.sayName() // aa
var p6 = new Person('b',18)
p6.sayName() // b
console.log(p5 instanceof Person) // true
console.log(p5 instanceof Person) // true

console.log(p6.__proto__ === p6.__proto__)

优点：方法不会重建
缺点：所有属性和方法都共享 不能初始化参数

  • 原型模式优化
    优点：方法不会重建 封装更好 更简单
    缺点：所有属性和方法都共享 不能初始化参数 完全重写了原型 ，导致constructor指向不对，要明确指向constructor
/**
 * 原型模式优化
 * 优点：方法不会重建 更简单
 * 缺点：所有属性和方法都共享 不能初始化参数 完全重写了原型 ，导致constructor指向不对，要明确指向constructor
 * */
function Person11() {

}
Person11.prototype = {
    constructor: Person11,  // 完全重写了原型 ，导致constructor指向不对，要明确指向constructor
    name : 'a',
    age: 18,
    sayName:function() {
        console.log(this.name)
    }
}
var p55 = new Person11()
p55.sayName() // a
p55.name = 'aa'
p55.sayName() // aa
var p66 = new Person1()
p66.sayName() // a
console.log(p55 instanceof Person11) // true
console.log(p55 instanceof Person11) // true

console.log(p66.__proto__ === p55.__proto__) // false
console.log(Person11.prototype.constructor === Person11) // true

组合模式

就是把构造模式和原型模式组合起来，私有变量放在构造函数里面，公用方法放在原型链里面

function Person2(name,age) {
 this.name = name;
 this.age = age
}
Person2.prototype.sayName = function() {
    console.log(this.name)
}
var p7 = new Person2('a',18)
p7.sayName() // a
p7.name = 'aa'
p7.sayName() // aa
var p8 = new Person2('b',18)
p8.sayName() // b
console.log(p7 instanceof Person2) // true
console.log(p7 instanceof Person2) // true

console.log(p8.__proto__ === p7.__proto__)

优点：有私有变量 和 共有 方面

动态原型模式

就是把组合模式改变下 原型链定义的方法放在构造函数里面，如果实例没有这个方法 就定义这把这个方法放在原型里,
相比组合模式 封装更多

function Person3(name,age) {
    this.name = name;
    this.age = age
    if(typeof this.sayName !== 'function') {
        Person3.prototype.sayName = function() {
        console.log(this.name)
       }
        // 或者
        // Person3.prototype = {
        //     constructor: Person3, // 对象字面量会导致原型被覆盖 实例的原型指向错误 需要明确指向constructor
        //     sayName: function() {
        //         console.log(this.name)
        //     }
        // }
    }
}
var p7 = new Person3('a',18)
p7.sayName() // a
p7.name = 'aa'
p7.sayName() // aa
var p8 = new Person3('b',18)
p8.sayName() // b
console.log(p7 instanceof Person3) // true 改为对象字面量 变为 false
console.log(p7 instanceof Person3) // true 改为对象字面量 变为 false
console.log(p7.__proto__)

console.log(p8.__proto__ === p7.__proto__) // true 改为对象字面量 变为 false

寄生构造函数

就是把工厂方法写在构造函数里面 和工厂方法的区别是实例通过new

function Person4(name,age) {
    var o = new Object()
    o.name = name;
    o.age = age;
    o.sayName=function() {
        console.log(this.name)
    }
    return o
}
var p7 = new Person4('a',18)
p7.sayName() // a
p7.name = 'aa'
p7.sayName() // aa
var p8 = new Person4('b',18)
p8.sayName() // b
console.log(p7 instanceof Person4) //  false
console.log(p7 instanceof Object) //  true

console.log(p8.__proto__ === p7.__proto__) // true

用途：对某个类型进行属性增强时 出于安全考虑不能直接修改原型，可以考虑这种方式

function SpecialArray() {
     var values = new Array();
     values.push.apply(values, arguments);
     values.toPipedString = function() {
         return this.join("|");
     };

     return values;
 }
 var colors = new SpecialArray("red", "blue", "green");
 console.log(colors.toPipedString());    //"red|blue|green"

稳妥构造函数

不用this 没有公共属性 不用new
优点：安全

function person9(name){
    var o = new Object();
    o.sayName = function(){
        console.log(name);
    };
    return o;
}

var person1 = person9('kevin');

person1.sayName(); // kevin

person1.name = "daisy";

person1.sayName(); // kevin

console.log(person1.name); // daisy

区别

工厂模式 构造函数模式 原型模式 组合模式 动态模式 寄生构造函数 稳妥构造函数
描述 一个function 里面返回一个对象 一个构造函数 this new()声明 Prototype 构造函数(属性)+原型模式(方法) 组合模式改进 把方法定义放在构造函数里面 就是工厂函数 只是用new声明 就是工厂函数 只是不用this 没有共有属性 只有方法 返回传入的值
优点 简单 能一次创建多个对象实例 显式的创建一种类型 方法只创建一次 既有共有方法也有私有属性 封装更好
缺点 创建的对象没法区分类型 都指向object 方法每次创建都要创建一次 属性和方法公用 不能初始化属性
用途 类型属性增强 安全场景

方法

  • 获取属性

    • Object.getOwnPropertyDescriptor(o, ‘name’) 获取o.name属性 不能获取原型链上的

    • Object.getOwnPropertyDescriptors(o) 获取o全部属性 不能获取原型链上的

  • 枚举

    • Object.getOwnPropertyNames(o) 获取string 的键名 不能获取原型链上的
    • Object.keys(o) 获取string 的键名 不能获取原型链上的
    • Object.getOwnPropertySymbols(o) 获取symbol键名 不能获取原型链上的
    • For in能获取原型链上的键名 拿不到symbol
    • Reflect.ownKeys(o) 不包括原型链上的 包括Symbol

  • o.hasOwnProperty(‘name’) 判断是否是原生属性 不能获取到原型链上的

var id = Symbol();
var o = { name: 'a', age: 18, [id]: 1 }; // 对象的key 键名是数值
co[id]; // 1
// 获取key string
Object.getOwnPropertyNames(o); //[ 'name', 'age' ]
Object.keys(o); //[ 'name', 'age' ]
// 获取key Symbol
Object.getOwnPropertySymbols(o); // [ Symbol() ]

// 获取所以属性
Object.getOwnPropertyNames(o).concat(Object.getOwnPropertySymbols(o)); // [ 'name', 'age', Symbol() ]
Reflect.ownKeys(o); // [ 'name', 'age', Symbol() ]

// 获取属性
Object.getOwnPropertyDescriptor(o, 'name'); // { value: 'a', writable: true, enumerable: true, configurable: true }
Object.getOwnPropertyDescriptors(o); 
// {
//   name: { value: 'a', writable: true, enumerable: true, configurable: true },
//   age: { value: 18, writable: true, enumerable: true, configurable: true },
//   [Symbol()]: { value: 1, writable: true, enumerable: true, configurable: true }
// }

var b = Symbol('b');
function person() {
  this.name = 'a';
  this.age = 18;
  this[b] = 2;
}

person.prototype[id] = 1;
person.prototype.sex = 'girl';
var p = new person();
p[id]; // 1
// 获取key string
Object.getOwnPropertyNames(p); //[ 'name', 'age' ]
Object.keys(p); //[ 'name', 'age' ]
// 获取key Symbol
Object.getOwnPropertySymbols(p); // [ Symbol(b) ]

// 获取所以属性
Object.getOwnPropertyNames(p).concat(Object.getOwnPropertySymbols(p)); // [ 'name', 'age', Symbol(b) ]
Reflect.ownKeys(p); // [ 'name', 'age', Symbol(b) ]

// 获取属性
Object.getOwnPropertyDescriptor(p, 'name'); // { value: 'a', writable: true, enumerable: true, configurable: true }
Object.getOwnPropertyDescriptors(p);
// {
//   name: { value: 'a', writable: true, enumerable: true, configurable: true },
//   age: { value: 18, writable: true, enumerable: true, configurable: true }
//    [Symbol(b)]: { value: 2, writable: true, enumerable: true, configurable: true }
// }

for (let i in o) {
  console.log(i); // name age
}

for (let i in p) {
  console.log(i); // name age sex
}

console.log(o.hasOwnProperty('name')); // true
console.log(p.hasOwnProperty('name')); // true

console.log(o.hasOwnProperty(id)); // true
console.log(p.hasOwnProperty(id)); // false
console.log(p.hasOwnProperty(b)); // true

原型 vs 原型链

原型

定义：每个对象创建时都会与之关联一个原型对象，每个对象都会从原型继承属性。

对象是通过构造函数创建的 这个构造函数有一个属性prototype是一个对象，这个对象就是原型。原型包括了一些公用的属性和方法。构造函数创建的对象会从这个原型中继承这个属性。当找一个属性或者方法时在对象找不到会沿着原型链找。

function Person(){

}
Person.prototype.name = 'a'  // 这里的protype就是原型
var p = new Person()
console.log(p.name) // a  // p对象会从Person.protype原型那里继承name属性


console.log(Person.prototype) // {name:'a'} prototype指向原型对象
console.log(Object.getPrototypeOf(p) ) // {name:'a'} Object.getPrototypeOf 获取原型对象
console.log(p.__proto__ === Person.prototype) // true 对象的___proto__指向对象的原型
console.log(Object.getPrototypeOf(p)=== Person.prototype ) //true
console.log(Person === Person.prototype.constructor) // true 原型的constructor指向构造函数

console.log(Person.prototype.__proto__) // [Object: null prototype] {} 原型的原型是object

console.log(Person.prototype.__proto__.__proto__) // null 原型链的尽头是null

console.log(Person.prototype.__proto__ === Object.prototype) // true 原型的原型是object的原型

重学前端-面向对象_第1张图片

构造函数 实例 原型 的关系如上图：

  • 构造函数的prototype指向原型对象
  • 原型对象的constrctor指向构造函数
  • 构造函数new 出来的实例 通过__proto__指向原型对象 Object.getPrototypeOf(实例) 获取实例的原型对象

原型链

定义：就是相互关联的原型 形成的一个链条 相互之间通过__proto__连接。原型对象是通过obejct构造函数创建的，原型的原型是object的原型对象, 原型链的尽头时null。
重学前端-面向对象_第2张图片

new的原理 手动实现

  1. 首先创建了一个空对象

  2. 然后设置空对象的__proto__作为构造函数的原型prototype

  3. 然后让构造函数的this指向这个对象，允许构造函数

  4. 判断构造函数的返回值 如果是引用类型就返回这个引用类型，如果不是返回创建的对象

    function createNew(fn) {
 const obj = {};
 obj.__proto__ = fn.prototype;
 const result = fn.apply(obj,[...arguments].slice(1));
 return typeof result === 'object' ? result:obj
}


function Person(name,age) {
   this.name = name;
   this.age = age;
}

Person.prototype.sayName = function() {
      console.log(this.name)
}

Person.prototype.sayAge = function() {
      console.log(this.age)
}

const p = createNew(Person,'aa',18)
p.sayName() // aa
p.sayAge() // 18xxxxxxxxxx funcfunction createNew(fn) { const obj = {}; obj.__proto__ = fn.prototype; const result = fn.apply(obj,[...arguments].slice(1)); return typeof result === 'object' ? result:obj}function Person(name,age) {   this.name = name;   this.age = age;}Person.prototype.sayName = function() {      console.log(this.name)}Person.prototype.sayAge = function() {      console.log(this.age)}const p = createNew(Person,'aa',18)p.sayName() // aap.sayAge() // 18

继承

原型链继承

利用原型链的特性 让child的prototype原型指向parent的实例 这样构造原型链 child就可以访问parent的元素

缺点是 1.构造函数的属性共享， 如果是引用类型 一个子类的实例修改了这个属性 其他实例继承到的属性也会改变 2. 无法向父类传参

/**
 * 原型链继承
 * */
function Parent(firstName,lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
    this.friend = {
        firstName:'li',
        lastName:'si'
    }
}
Parent.prototype.sayName = function () {
    console.log(this.lastName+this.firstName)
}

function Child(firstName) {
    this.firstName = firstName;
}
const parent = new Parent('san','zhang');
Child.prototype = parent
const child = new Child('si');

const child1 = new Child('si');

child.sayName() // zhangsi
parent.sayName() // zhangsan
console.log(child.friend) // { firstName: 'li', lastName: 'si' }

// 缺点是 构造函数的属性共享， 如果是引用类型 一个子类的实例修改了这个属性 其他实例继承到的属性也会改变
child1.friend.firstName = 'hua'
console.log(child1.friend) // { firstName: 'hua', lastName: 'si' }
console.log(child.friend) // { firstName: 'hua', lastName: 'si' }

构造函数继承

可以解决原型链 引用属性共享会导致被子类修改的问题 可以向父类传递参

缺点：所有属性只能在构造函数创建 方法会被多次创建

/*构造函数继承*/
function Parent2(firstName,lastName) {
    this.firstName  = firstName;
    this.lastName = lastName;
    // 缺点是 只能在构造函数里面创建方法
    this.sayName = function () {
        console.log(this.lastName+this.firstName)
    }
    this.friend = {name:'li si'}
}

function Child2(name,age) {
    Parent2.call(this,...arguments)
}
const parent2 = new Parent2('san','zhang');
const child2 = new Child2('si','zhang');

const child21 = new Child2('wu','zhang');

child2.sayName() // zhangsi
parent2.sayName() // zhangsan
console.log(child2.friend) // { name: 'li si' }


// 可以解决原型链属性共享的问题，如果是引用类型 一个子类的实例修改了这个属性 其他实例继承到的属性不会改变
child21.friend.name = 'hua hua'
console.log(child21.friend) // { name: 'hua hua' }
console.log(child2.friend) // { name: 'li si' }

组合继承

利用构造函数+原型链 这样既可以在原型上定义方法，子类也可以继承，又可以让每一个子类有自己的属性 引用类型不会被子类改变 还可以向父类传参

/**
 * 组合继承
 * */
function Parent3(firstName,lastName) {
    this.firstName  = firstName;
    this.lastName = lastName;
    this.friend = {name:'li si'}
}

Parent3.prototype.sayName = function () {
    console.log(this.lastName+this.firstName)
}

function Child3(firstName,lastName) {
    Parent3.call(this,...arguments);
    this.firstName = firstName;
}
Child3.prototype = new Parent3() // 缺点是调用了两次父类构造函数
const parent3 = new Parent3('san','zhang');
const child3 = new Child3('si','zhang');

const child31 = new Child3('wu','zhang');

child3.sayName() // zhangsi
parent3.sayName() // zhangsan
console.log(child3.friend) // { name: 'li si' }

child31.friend.name = 'hua hua'
console.log(child31.friend) // { name: 'hua hua' }
console.log(child3.friend) // { name: 'li si' }

原型式继承

利用一个父类对象 作为原型 创建其他子类对象，子类对象就会继承父类对象

缺点：无法传递参数 引用类型会被改

/**
 * 原型式继承
 * */
var o = {
    firstName:'san',
    lastName:'zhang',
    sayName:function () {
        console.log(this.lastName+this.firstName)
    },
    friend:{name:'li si'}
}
var o1 = Object.create(o)  // 以o为新对象的原型创建对象
var o2 = Object.create(o)
o2.firstName='si'
o1.firstName = 'wu'
o2.friend = 'haha'
o1.sayName() // zhangwu
o2.sayName() //zhangsi
console.log(o2.friend) // haha
console.log(o1.friend) //lisi

// Object.create 自己实现 本质是内部有一个构造函数 把这个构造函数的原型指向传入的对象，返回构造函数的实例
function object(o) {
    function fn() {}
    fn.prototype = o;
    return new fn();
}
var o11 = object(o)  // 以o为新对象的原型创建对象
var o22 = object(o)
o22.firstName='si'
o11.firstName = 'wu'
o22.friend = 'haha'
o11.sayName() // zhangwu
o22.sayName() //zhangsi
console.log(o22.friend) // haha
console.log(o11.friend) //lisi

寄生式继承

就是把 object.create 方法封装到了一个函数里面

/**
 * 寄生式继承
 * */
function object(obj) {
  function fn {}
  fn.prototype = obj
  return new fn();
}

function createAnother(parent) {
    var  o = object(parent)
    o.firstName='si'
    return o
}
const oo = {firstName:'san',lastName:'zhang',friend:{name:'lisi'},sayName:function (){console.log(this.lastName+this.firstName)}}
var o3 = createAnother(oo)
var o4 = createAnother(oo)
o3.sayName() // zhangsi
o3.friend.name = 'huahua'
console.log(o4.friend) // huahua

缺点：无法传递参数 引用类型会被改

寄生组合式继承

组合继承+寄生式 能解决组合继承父类构造函数会被调用两次的问题

function inherit(subType,superType) {
    var prototype = Object.create(superType.prototype);
    prototype.constructor = superType;
    subType.prototype = prototype;
}

function SuperType(firstName,lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
    this.friend = {
        name:'lisi'
    }
}
SuperType.prototype.sayName= function () {
    console.log(this.lastName+this.firstName)
}
function SubType(firstName,lastName) {
   SuperType.call(this,...arguments)
    this.age = 18;
}

inherit(SubType,SuperType)
const parent5 = new SuperType('san','zhang')
parent5.sayName() // zhangsan
const child5 = new SubType('si','zhang')
const child6 = new SubType('wu','zhang')
child5.sayName() // zhangsi
child6.sayName() // zhangwu

console.log(parent5.friend) // { name: 'lisi' }
child5.friend.name ='haha'
console.log(child5.friend) // { name: 'haha' }
console.log(child6.friend) // { name: 'lisi' }
console.log(parent5.friend) // { name: 'lisi' }

区别

继承方式 描述 优点 缺点
原型链继承 利用原型链上可以访问上一级属性，让子类的protype属性等于父类的实例 SubType.prototype=new SuperType() 实现了继承 1.引用属性共享 子类可以篡改父类的属性 2. 子类无法向父类传递参数
构造函数继承 在子类的构造函数调用父类的构造函数 改变this指向子类 Super.call(this,…arguments) 1. 应用属性不会共享 2. 子类可以向父类传递参数 1. 所有属性只能封装在构造函数里面 每次创建实例 方法都会被创建一次
组合式继承 原型式继承+构造函数继承 ，利用构造函数继承父类的属性，利用原型继承父类的方法 1. 应用属性不会共享 2. 子类可以向父类传递参数3.方法也只会创建一遍 父类构造函数会被调用两次
原型式继承 Object.create 会以传入的对象作为原型创造一个新对象 本质是内部声明了一个构造函数 把这个构造函数的prototype属性指向这个函数 最后返回这个函数的实例 同原型链继承
寄生式继承 就是把原型式继承用一个函数封装起来 其实同原型式继承 同上
寄生组合式 组合式+寄生式 利用寄生式继承的特点 解决组合式继承父类构造函数会被调用两次的问题 function inhret(subType,superType){ var prototype = Object.create(superType.prototype);prototype.constructor=SuperType;subType.prototype=protptype} 1. 应用属性不会共享 2. 子类可以向父类传递参数3.方法也只会创建一遍 4.父类构造函数也只会调用一次

你可能感兴趣的:(重学前端,前端,javascript,vue.js)

  • element实现动态路由+面包屑 软件技术NINI vue案例vue.js前端
    el-breadcrumb是ElementUI组件库中的一个面包屑导航组件，它用于显示当前页面的路径，帮助用户快速理解和导航到应用的各个部分。在Vue.js项目中，如果你已经安装了ElementUI，就可以很方便地使用el-breadcrumb组件。以下是一个基本的使用示例：安装ElementUI（如果你还没有安装的话）:你可以通过npm或yarn来安装ElementUI。bash复制代码npmi
  • Long类型前后端数据不一致 igotyback 前端
    响应给前端的数据浏览器控制台中response中看到的Long类型的数据是正常的到前端数据不一致前后端数据类型不匹配是一个常见问题，尤其是当后端使用Java的Long类型（64位）与前端JavaScript的Number类型（最大安全整数为2^53-1，即16位）进行数据交互时，很容易出现精度丢失的问题。这是因为JavaScript中的Number类型无法安全地表示超过16位的整数。为了解决这个问
  • DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理 STU学生网页设计 网页设计期末网页作业html静态网页html5期末大作业网页设计web大作业
    ️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
  • 【加密社】Solidity 中的事件机制及其应用 加密社 闲侃区块链智能合约区块链
    加密社引言在Solidity合约开发过程中，事件（Events）是一种非常重要的机制。它们不仅能够让开发者记录智能合约的重要状态变更，还能够让外部系统（如前端应用）监听这些状态的变化。本文将详细介绍Solidity中的事件机制以及如何利用不同的手段来触发、监听和获取这些事件。事件存储的地方当我们在Solidity合约中使用emit关键字触发事件时，该事件会被记录在区块链的交易收据中。具体而言，事件
  • 关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript 二挡起步 web前端期末大作业javascripthtmlcss旅游风景
    ⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip
  • HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动 二挡起步 web前端期末大作业web设计网页规划与设计htmlcssjavascriptdreamweaver前端
    Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线
  • node.js学习 小猿L node.jsnode.js学习vim
    node.js学习实操及笔记温故node.js，node.js学习实操过程及笔记~node.js学习视频node.js官网node.js中文网实操笔记githubcsdn笔记为什么学node.js可以让别人访问我们编写的网页为后续的框架学习打下基础，三大框架vuereactangular离不开node.jsnode.js是什么官网：node.js是一个开源的、跨平台的运行JavaScript的运行
  • springboot+vue项目实战一-创建SpringBoot简单项目 苹果酱0567 面试题汇总与解析springboot后端java中间件开发语言
    这段时间抽空给女朋友搭建一个个人博客，想着记录一下建站的过程，就当做笔记吧。虽然复制zjblog只要一个小时就可以搞定一个网站，或者用cms系统，三四个小时就可以做出一个前后台都有的网站，而且想做成啥样也都行。但是就是要从新做，自己做的意义不一样，更何况，俺就是专门干这个的，嘿嘿嘿要做一个网站，而且从零开始，首先呢就是技术选型了，经过一番思量决定选择-SpringBoot做后端，前端使用Vue做一
  • JavaScript 中，深拷贝（Deep Copy）和浅拷贝（Shallow Copy） 跳房子的前端 前端面试javascript开发语言ecmascript
    在JavaScript中，深拷贝（DeepCopy）和浅拷贝（ShallowCopy）是用于复制对象或数组的两种不同方法。了解它们的区别和应用场景对于避免潜在的bugs和高效地处理数据非常重要。以下是对深拷贝和浅拷贝的详细解释，包括它们的概念、用途、优缺点以及实现方式。1.浅拷贝（ShallowCopy）概念定义：浅拷贝是指创建一个新的对象或数组，其中包含了原对象或数组的基本数据类型的值和对引用数
  • 博客网站制作教程 2401_85194651 javamaven
    首先就是技术框架：后端：Java+SpringBoot数据库：MySQL前端：Vue.js数据库连接：JPA(JavaPersistenceAPI)1.项目结构blog-app/├──backend/│├──src/main/java/com/example/blogapp/││├──BlogApplication.java││├──config/│││└──DatabaseConfig.java
  • JavaScript `Map` 和 `WeakMap`详细解释 跳房子的前端 JavaScript原生方法javascript前端开发语言
    在JavaScript中，Map和WeakMap都是用于存储键值对的数据结构，但它们有一些关键的不同之处。MapMap是一种可以存储任意类型的键值对的集合。它保持了键值对的插入顺序，并且可以通过键快速查找对应的值。Map提供了一些非常有用的方法和属性来操作这些数据对：set(key,value):将一个键值对添加到Map中。如果键已经存在，则更新其对应的值。get(key):获取指定键的值。如果键
  • 最简单将静态网页挂载到服务器上(不用nginx) 全能全知者 服务器nginx运维前端html笔记
    最简单将静态网页挂载到服务器上(不用nginx)如果随便弄个静态网页挂在服务器都要用nignx就太麻烦了，所以直接使用Apache来搭建一些简单前端静态网页会相对方便很多检查Web服务器服务状态：sudosystemctlstatushttpd#ApacheWeb服务器如果发现没有安装web服务器：安装Apache：sudoyuminstallhttpd启动Apache：sudosystemctl
  • 补充元象二面 Redstone Monstrosity 前端面试
    1.请尽可能详细地说明，防抖和节流的区别，应用场景？你的回答中不要写出示例代码。防抖（Debounce）和节流（Throttle）是两种常用的前端性能优化技术，它们的主要区别在于如何处理高频事件的触发。以下是防抖和节流的区别和应用场景的详细说明：防抖和节流的定义防抖：在一段时间内，多次执行变为只执行最后一次。防抖的原理是，当事件被触发后，设置一个延迟定时器。如果在这个延迟时间内事件再次被触发，则重
  • 微信小程序开发注意事项 jun778895 微信小程序小程序
    微信小程序开发是一个融合了前端开发、用户体验设计、后端服务（可选）以及微信小程序平台特性的综合性项目。这里，我将详细介绍一个典型的小程序开发项目的全过程，包括项目规划、设计、开发、测试及部署上线等各个环节，并尽量使内容达到或超过2000字的要求。一、项目规划1.1项目背景与目标假设我们要开发一个名为“智慧校园助手”的微信小程序，旨在为学生提供一站式校园生活服务，包括课程表查询、图书馆座位预约、食堂
  • 切换淘宝最新npm镜像源是 hai40587 npm前端node.js
    切换淘宝最新npm镜像源是一个相对简单的过程，但首先需要明确当前淘宝npm镜像源的状态和最新的镜像地址。由于网络环境和服务更新，镜像源的具体地址可能会发生变化，因此，我将基于当前可获取的信息，提供一个通用的切换步骤，并附上最新的镜像地址（截至回答时）。一、了解npm镜像源npm（NodePackageManager）是JavaScript的包管理器，用于安装、更新和管理项目依赖。由于npm官方仓库
  • 字节二面 Redstone Monstrosity 前端面试
    1.假设你是正在面试前端开发工程师的候选人，面试官让你详细说出你上一段实习过程的收获和感悟。在上一段实习过程中，我获得了宝贵的实践经验和深刻的行业洞察，以下是我的主要收获和感悟：一、专业技能提升框架应用熟练度：通过实际项目，我深入掌握了React、Vue等前端框架的使用，不仅提升了编码效率，还学会了如何根据项目需求选择合适的框架。问题解决能力：在实习期间，我遇到了许多预料之外的技术难题。通过查阅文
  • 前端代码上传文件 余生逆风飞翔 前端javascript开发语言
    点击上传文件import{ElNotification}from'element-plus'import{API_CONFIG}from'../config/index.js'import{UploadFilled}from'@element-plus/icons-vue'import{reactive}from'vue'import{BASE_URL}from'../config/index'i
  • uniapp实现动态标记效果详细步骤【前端开发】 2401_85123349 uni-app
    第二个点在于实现将已经被用户标记的内容在下一次获取后刷新它的状态为已标记。这是什么意思呢？比如说上面gif图中的这些人物对象，有一些已被该用户添加为关心，那么当用户下一次进入该页面时，这些已经被添加关心的对象需要以“红心”状态显现出来。这个点的难度还不算大，只需要在每一次获取后端的内容后对标记对象进行状态更新即可。II.动态标记效果实现思路和步骤首先，整体的思路是利用动态类名对不同的元素进行选择。
  • 高性能javascript--算法和流程控制 海淀萌狗
    -for,while和do-while性能相当-避免使用for-in循环，==除非遍历一个属性量未知的对象==es5:for-in遍历的对象便不局限于数组，还可以遍历对象。原因：for-in每次迭代操作会同时搜索实例或者原型属性，for-in循环的每次迭代都会产生更多开销，因此要比其他循环类型慢，一般速度为其他类型循环的1/7。因此，除非明确需要迭代一个属性数量未知的对象，否则应避免使用for-i
  • 360前端星计划-动画可以这么玩 马小蜗
    动画的基本原理定时器改变对象的属性根据新的属性重新渲染动画functionupdate(context){//更新属性}constticker=newTicker();ticker.tick(update,context);动画的种类1、JavaScript动画操作DOMCanvas2、CSS动画transitionanimation3、SVG动画SMILJS动画的优缺点优点：灵活度、可控性、性能
  • Vue + Express实现一个表单提交 九旬大爷的梦
    最近在折腾一个cms系统，用的vue+express，但是就一个表单提交就弄了好久，记录一下。环境：Node10+前端：Vue服务端：Express依赖包：vueexpressaxiosexpress-formidableelement-ui（可选）前言：axiosget请求参数是：paramsaxiospost请求参数是：dataexpressget接受参数是req.queryexpresspo
  • JavaScript中秋快乐！ Q_w7742 javascript开发语言ecmascript
    我们来实现一个简单的祝福网页~主要的难度在于使用canvas绘图当点击canvas时候，跳出“中秋节快乐”字样，需要注册鼠标单击事件和计时器。首先定义主要函数：初始化当点击canvas之后转到onCanvasClick函数，绘图生成灯笼。functiononCanvasClick(){//事件处理函数context.clearRect(0,0,canvas1.width,canvas1.heigh
  • Nginx从入门到实践(三) 听你讲故事啊
    动静分离动静分离是将网站静态资源（JavaScript，CSS，img等文件）与后台应用分开部署，提高用户访问静态代码的速度，降低对后台应用访问。动静分离的一种做法是将静态资源部署在nginx上，后台项目部署到应用服务器上，根据一定规则静态资源的请求全部请求nginx服务器，达到动静分离的目标。rewrite规则Rewrite规则常见正则表达式Rewrite主要的功能就是实现URL的重写，Ngin
  • Nginx的使用场景：构建高效、可扩展的Web架构 张某布响丸辣 nginx前端架构
    Nginx，作为当今最流行的Web服务器和反向代理软件之一，凭借其高性能、稳定性和灵活性，在众多Web项目中扮演着核心角色。无论是个人博客、中小型网站，还是大型企业级应用，Nginx都能提供强大的支持。本文将探讨Nginx的几个主要使用场景，帮助读者理解如何在实际项目中充分利用Nginx的优势。1.静态文件服务对于包含大量静态文件（如HTML、CSS、JavaScript、图片等）的网站，Ngin
  • 前端知识点 ZhangTao_zata 前端javascriptcss
    下面是一个最基本的html代码body{font-family:Arial,sans-serif;margin:20px;}//JavaScriptfunctionthatdisplaysanalertwhencalledfunctionshowMessage(){alert("Hello!Youclickedthebutton.");}MyFirstHTMLPageWelcometoMyPage
  • 第三十一节:Vue路由:前端路由vs后端路由的了解 曹老师
    1.认识前端路由和后端路由前端路由相对于后端路由而言的,在理解前端路由之前先对于路由有一个基本的了解路由:简而言之,就是把信息从原地址传输到目的地的活动对于我们来说路由就是:根据不同的url地址展示不同的页面内容1.1后端路由以前咱们接触比较多的后端路由,当改变url地址时,浏览器会向服务器发送请求,服务器根据这个url,返回不同的资源内容后端路由的特点就是前端每次跳转到不同url地址,都会重新访
  • 华雁智科前端面试题 因为奋斗超太帅啦 前端笔试面试问题整理javascript开发语言ecmascript
    1.var变量的提升题目：vara=1functionfun(){console.log(b)varb=2}fun()console.log(a)正确输出结果：undefined、1答错了，给一个大嘴巴子，错误答案输出结果为：2,1此题主要考察var定义的变量，作用域提升的问题，相当于varaa=1functionfun(){varbconsole.log(b)b=2}fun()console.l
  • 如何建设数据中台（五）——数据汇集—打破企业数据孤岛 weixin_47088026 学习记录和总结中台数据中台程序人生经验分享
    数据汇集——打破企业数据孤岛要构建企业级数据中台，第一步就是将企业内部各个业务系统的数据实现互通互联，打破数据孤岛，主要通过数据汇聚和交换来实现。企业采集的数据可以是线上采集、线下数据采集、互联网数据采集、内部数据采集等。线上数据采集主要载体分为互联网和移动互联网两种，对应有系统平台、网页、H5、小程序、App等，可以采用前端或后端埋点方式采集数据。线下数据采集主要是通过硬件来采集，例如：WiFi
  • 分布式锁和spring事务管理 暴躁的鱼 锁及事务分布式springjava
    最近开发一个小程序遇到一个需求需要实现分布式事务管理业务需求用户在使用小程序的过程中可以查看景点，对景点地区或者城市标记是否想去，那么需要统计一个地点被标记的人数，以及记录某个用户对某个地点是否标记为想去，用两个表存储数据，一个地点表记录改地点被标记的次数，一个用户意向表记录某个用户对某个地点是否标记为想去。由于可能有多个用户同时标记一个地点，每个用户在前端点击想去按钮之后，后台接收到请求，从数据
  • 前端CSS面试常见题 剑亦未配妥 前端面试前端css面试
    边界塌陷盒模型有两种：W3C盒模型和IE盒模型，区别在于宽度是否包含边框定义：同时给兄弟/父子盒模型设置上下边距，理论上边距值是两者之和，实际上不是注意：浮动和定位不会产生边界塌陷；只有块级元素垂直方向才会产生margin合并margin计算方案margin同为正负：取绝对值大的值一正一负：求和父子元素边界塌陷解决父元素可以通过调整padding处理；设置overflowhidden，触发BFC子
  • 算法 单链的创建与删除 换个号韩国红果果 c算法
    先创建结构体 struct student { int data; //int tag;//标记这是第几个 struct student *next; }; // addone 用于将一个数插入已从小到大排好序的链中 struct student *addone(struct student *h,int x){ if(h==NULL) //??????
  • 《大型网站系统与Java中间件实践》第2章读后感 白糖_ java中间件
           断断续续花了两天时间试读了《大型网站系统与Java中间件实践》的第2章，这章总述了从一个小型单机构建的网站发展到大型网站的演化过程---整个过程会遇到很多困难，但每一个屏障都会有解决方案，最终就是依靠这些个解决方案汇聚到一起组成了一个健壮稳定高效的大型系统。          看完整章内容，
  • zeus持久层spring事务单元测试 deng520159 javaDAOspringjdbc
    今天把zeus事务单元测试放出来,让大家指出他的毛病, 1.ZeusTransactionTest.java 单元测试   package com.dengliang.zeus.webdemo.test; import java.util.ArrayList; import java.util.List; import org.junit.Test; import
  • Rss 订阅 开发 周凡杨 htmlxml订阅rss规范
                    RSS是 Really Simple Syndication的缩写（对rss2.0而言，是这三个词的缩写，对rss1.0而言则是RDF Site Summary的缩写，1.0与2.0走的是两个体系）。   RSS
  • 分页查询实现 g21121 分页查询
    在查询列表时我们常常会用到分页，分页的好处就是减少数据交换，每次查询一定数量减少数据库压力等等。 按实现形式分前台分页和服务器分页： 前台分页就是一次查询出所有记录，在页面中用js进行虚拟分页，这种形式在数据量较小时优势比较明显，一次加载就不必再访问服务器了，但当数据量较大时会对页面造成压力，传输速度也会大幅下降。 服务器分页就是每次请求相同数量记录，按一定规则排序，每次取一定序号直接的数据
  • spring jms异步消息处理 510888780 jms
    spring JMS对于异步消息处理基本上只需配置下就能进行高效的处理。其核心就是消息侦听器容器，常用的类就是DefaultMessageListenerContainer。该容器可配置侦听器的并发数量，以及配合MessageListenerAdapter使用消息驱动POJO进行消息处理。且消息驱动POJO是放入TaskExecutor中进行处理，进一步提高性能，减少侦听器的阻塞。具体配置如下：
  • highCharts柱状图 布衣凌宇 hightCharts柱图
    第一步：导入 exporting.js,grid.js,highcharts.js;第二步：写controller   @Controller@RequestMapping(value="${adminPath}/statistick")public class StatistickController {  private UserServi
  • 我的spring学习笔记2-IoC（反向控制 依赖注入） aijuans springmvcSpring 教程spring3 教程Spring 入门
    IoC（反向控制 依赖注入）这是Spring提出来了，这也是Spring一大特色。这里我不用多说，我们看Spring教程就可以了解。当然我们不用Spring也可以用IoC，下面我将介绍不用Spring的IoC。 IoC不是框架，她是java的技术，如今大多数轻量级的容器都会用到IoC技术。这里我就用一个例子来说明： 如：程序中有 Mysql.calss 、Oracle.class 、SqlSe
  • TLS java简单实现 antlove javasslkeystoretlssecure
      1. SSLServer.java package ssl; import java.io.FileInputStream; import java.io.InputStream; import java.net.ServerSocket; import java.net.Socket; import java.security.KeyStore; import
  • Zip解压压缩文件 百合不是茶 Zip格式解压Zip流的使用文件解压
       ZIP文件的解压缩实质上就是从输入流中读取数据。Java.util.zip包提供了类ZipInputStream来读取ZIP文件,下面的代码段创建了一个输入流来读取ZIP格式的文件; ZipInputStream in = new ZipInputStream(new FileInputStream(zipFileName));     &n
  • underscore.js 学习（一） bijian1013 JavaScriptunderscore
            工作中需要用到underscore.js，发现这是一个包括了很多基本功能函数的js库，里面有很多实用的函数。而且它没有扩展 javascript的原生对象。主要涉及对Collection、Object、Array、Function的操作。       学
  • java jvm常用命令工具——jstatd命令(Java Statistics Monitoring Daemon) bijian1013 javajvmjstatd
    1.介绍         jstatd是一个基于RMI（Remove Method Invocation）的服务程序，它用于监控基于HotSpot的JVM中资源的创建及销毁，并且提供了一个远程接口允许远程的监控工具连接到本地的JVM执行命令。         jstatd是基于RMI的，所以在运行jstatd的服务
  • 【Spring框架三】Spring常用注解之Transactional bit1129 transactional
    Spring可以通过注解@Transactional来为业务逻辑层的方法(调用DAO完成持久化动作)添加事务能力，如下是@Transactional注解的定义：   /* * Copyright 2002-2010 the original author or authors. * * Licensed under the Apache License, Version
  • 我(程序员)的前进方向 bitray 程序员
    作为一个普通的程序员,我一直游走在java语言中,java也确实让我有了很多的体会.不过随着学习的深入,java语言的新技术产生的越来越多,从最初期的javase,我逐渐开始转变到ssh,ssi,这种主流的码农,.过了几天为了解决新问题,webservice的大旗也被我祭出来了,又过了些日子jms架构的activemq也开始必须学习了.再后来开始了一系列技术学习,osgi,restful.....
  • nginx lua开发经验总结 ronin47
    使用nginx lua已经两三个月了，项目接开发完毕了，这几天准备上线并且跟高德地图对接。回顾下来lua在项目中占得必中还是比较大的，跟PHP的占比差不多持平了，因此在开发中遇到一些问题备忘一下 1：content_by_lua中代码容量有限制，一般不要写太多代码，正常编写代码一般在100行左右（具体容量没有细心测哈哈，在4kb左右），如果超出了则重启nginx的时候会报 too long pa
  • java-66-用递归颠倒一个栈。例如输入栈{1,2,3,4,5}，1在栈顶。颠倒之后的栈为{5,4,3,2,1}，5处在栈顶 bylijinnan java
    import java.util.Stack; public class ReverseStackRecursive { /** * Q 66.颠倒栈。 * 题目：用递归颠倒一个栈。例如输入栈{1,2,3,4,5}，1在栈顶。 * 颠倒之后的栈为{5,4,3,2,1}，5处在栈顶。 *1. Pop the top element *2. Revers
  • 正确理解Linux内存占用过高的问题 cfyme linux
    Linux开机后，使用top命令查看，4G物理内存发现已使用的多大3.2G，占用率高达80%以上： Mem:   3889836k total,  3341868k used,   547968k free,   286044k buffers Swap:  6127608k total,&nb
  • [JWFD开源工作流]当前流程引擎设计的一个急需解决的问题 comsci 工作流
         当我们的流程引擎进入IRC阶段的时候，当循环反馈模型出现之后，每次循环都会导致一大堆节点内存数据残留在系统内存中，循环的次数越多，这些残留数据将导致系统内存溢出，并使得引擎崩溃。。。。。。       而解决办法就是利用汇编语言或者其它系统编程语言，在引擎运行时，把这些残留数据清除掉。
  • 自定义类的equals函数 dai_lm equals
    仅作笔记使用 public class VectorQueue { private final Vector<VectorItem> queue; private class VectorItem { private final Object item; private final int quantity; public VectorI
  • Linux下安装R语言 datageek R语言 linux
    命令如下：sudo gedit  /etc/apt/sources.list1、deb http://mirrors.ustc.edu.cn/CRAN/bin/linux/ubuntu/ precise/ 2、deb http://dk.archive.ubuntu.com/ubuntu hardy universesudo apt-key adv --keyserver ke
  • 如何修改mysql 并发数(连接数)最大值 dcj3sjt126com mysql
    MySQL的连接数最大值跟MySQL没关系，主要看系统和业务逻辑了   方法一：进入MYSQL安装目录 打开MYSQL配置文件 my.ini 或 my.cnf查找 max_connections=100 修改为 max_connections=1000 服务里重起MYSQL即可 　　方法二：MySQL的最大连接数默认是100客户端登录：mysql -uusername -ppass
  • 单一功能原则 dcj3sjt126com 面向对象的程序设计软件设计编程原则
    单一功能原则[ 编辑]     SOLID 原则 单一功能原则 开闭原则 Liskov代换原则 接口隔离原则 依赖反转原则 查   论   编 在面向对象编程领域中，单一功能原则（Single responsibility principle）规定每个类都应该有
  • POJO、VO和JavaBean区别和联系 fanmingxing VOPOJOjavabean
    POJO和JavaBean是我们常见的两个关键字，一般容易混淆，POJO全称是Plain Ordinary Java Object / Plain Old Java Object，中文可以翻译成：普通Java类，具有一部分getter/setter方法的那种类就可以称作POJO，但是JavaBean则比POJO复杂很多，JavaBean是一种组件技术，就好像你做了一个扳子，而这个扳子会在很多地方被
  • SpringSecurity3.X--LDAP：AD配置 hanqunfeng SpringSecurity
    前面介绍过基于本地数据库验证的方式，参考http://hanqunfeng.iteye.com/blog/1155226，这里说一下如何修改为使用AD进行身份验证【只对用户名和密码进行验证，权限依旧存储在本地数据库中】。   将配置文件中的如下部分删除： <!-- 认证管理器，使用自定义的UserDetailsService，并对密码采用md5加密-->
  • mac mysql 修改密码 IXHONG mysql
    $ sudo /usr/local/mysql/bin/mysqld_safe –user=root & //启动MySQL(也可以通过偏好设置面板来启动)$ sudo /usr/local/mysql/bin/mysqladmin -uroot password yourpassword //设置MySQL密码（注意，这是第一次MySQL密码为空的时候的设置命令，如果是修改密码，还需在-
  • 设计模式--抽象工厂模式 kerryg 设计模式
    抽象工厂模式：     工厂模式有一个问题就是，类的创建依赖于工厂类，也就是说，如果想要拓展程序，必须对工厂类进行修改，这违背了闭包原则。我们采用抽象工厂模式，创建多个工厂类，这样一旦需要增加新的功能，直接增加新的工厂类就可以了，不需要修改之前的代码。     总结：这个模式的好处就是，如果想增加一个功能，就需要做一个实现类，
  • 评"高中女生军训期跳楼” nannan408
       首先，先抛出我的观点，各位看官少点砖头。那就是，中国的差异化教育必须做起来。    孔圣人有云：有教无类。不同类型的人，都应该有对应的教育方法。目前中国的一体化教育，不知道已经扼杀了多少创造性人才。我们出不了爱迪生，出不了爱因斯坦，很大原因，是我们的培养思路错了，我们是第一要“顺从”。如果不顺从，我们的学校，就会用各种方法，罚站，罚写作业，各种罚。军
  • scala如何读取和写入文件内容？ qindongliang1922 javajvmscala
    直接看如下代码： package file import java.io.RandomAccessFile import java.nio.charset.Charset import scala.io.Source import scala.reflect.io.{File, Path} /** * Created by qindongliang on 2015/
  • C语言算法之百元买百鸡 qiufeihu c算法
    中国古代数学家张丘建在他的《算经》中提出了一个著名的“百钱买百鸡问题”，鸡翁一，值钱五，鸡母一，值钱三，鸡雏三，值钱一，百钱买百鸡，问翁，母，雏各几何？ 代码如下： #include <stdio.h> int main() { int cock,hen,chick; /*定义变量为基本整型*/ for(coc
  • Hadoop集群安全性：Hadoop中Namenode单点故障的解决方案及详细介绍AvatarNode wyz2009107220 NameNode
    正如大家所知，NameNode在Hadoop系统中存在单点故障问题，这个对于标榜高可用性的Hadoop来说一直是个软肋。本文讨论一下为了解决这个问题而存在的几个solution。 1. Secondary NameNode 原理：Secondary NN会定期的从NN中读取editlog，与自己存储的Image进行合并形成新的metadata image 优点：Hadoop较早的版本都自带，
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他