newJavaScript中的关键字在第一次遇到时会非常混乱,因为人们倾向于认为JavaScript不是面向对象的编程语言.
假设我创建了一个对象:
var myObject =
{"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};
Run Code Online (Sandbox Code Playgroud)
检索属性名称列表的最佳方法是什么?即我想最终得到一些变量'键',这样:
keys == ["ircEvent", "method", "regex"]
Run Code Online (Sandbox Code Playgroud) 该图再次显示每个对象都有一个原型.构造函数Foo也有自己
__proto__的Function.prototype,它又通过其__proto__属性再次引用到Object.prototype.因此,重复,Foo.prototype只是Foo的一个显式属性,它指的是b和c对象的原型.
var b = new Foo(20);
var c = new Foo(30);
Run Code Online (Sandbox Code Playgroud)
__proto__和prototype属性有什么区别?

这个数字来自这里.
javascript prototype prototypal-inheritance javascript-objects
目前在ES5中,我们很多人在框架中使用以下模式来创建类和类变量,这很舒服:
// ES 5
FrameWork.Class({
variable: 'string',
variable2: true,
init: function(){
},
addItem: function(){
}
});
Run Code Online (Sandbox Code Playgroud)
在ES6中,您可以本机创建类,但没有选项可以使用类变量:
// ES6
class MyClass {
const MY_CONST = 'string'; // <-- this is not possible in ES6
constructor(){
this.MY_CONST;
}
}
Run Code Online (Sandbox Code Playgroud)
遗憾的是,上面的代码不起作用,因为类只能包含方法.
我知道我可以this.myVar = true在constructor...但我不想"垃圾"我的构造,特别是当我有一个更大的类20-30 +参数.
我正在考虑处理这个问题的许多方法,但还没有找到任何好的方法.(例如:创建一个ClassConfig处理程序,并传递一个parameter与该类分开声明的对象.然后处理程序将附加到该类.我正在考虑WeakMaps以某种方式集成.)
你有什么样的想法来处理这种情况?
据说Javascript的一个主要优点是它是一种基于原型的语言.
但是,Javascript基于原型是什么意思,为什么这是一个优势呢?
我是JavaScript OOP的新手.你能解释下面的代码块之间的区别吗?我测试了两个块都有效.什么是最佳实践,为什么?
第一块:
function Car(name){
this.Name = name;
}
Car.prototype.Drive = function(){
console.log("My name is " + this.Name + " and I'm driving.");
}
SuperCar.prototype = new Car();
SuperCar.prototype.constructor = SuperCar;
function SuperCar(name){
Car.call(this, name);
}
SuperCar.prototype.Fly = function(){
console.log("My name is " + this.Name + " and I'm flying!");
}
var myCar = new Car("Car");
myCar.Drive();
var mySuperCar = new SuperCar("SuperCar");
mySuperCar.Drive();
mySuperCar.Fly();Run Code Online (Sandbox Code Playgroud)
第二块:
function Car(name){
this.Name = name;
this.Drive = function(){
console.log("My name is " + this.Name + …Run Code Online (Sandbox Code Playgroud)javascript oop inheritance constructor prototype-programming
function Gadget(name, color)
{
this.name = name;
this.color = color;
}
Gadget.prototype.rating = 3
var newtoy = new Gadget("webcam", "black")
newtoy.constructor.prototype.constructor.prototype.constructor.prototype
Run Code Online (Sandbox Code Playgroud)
它总是返回rating = 3的对象.
但如果我做以下事情:
newtoy.__proto__.__proto__.__proto__
Run Code Online (Sandbox Code Playgroud)
链条最终返回null.
另外在Internet Explorer中,如果没有__proto__属性,我如何检查null ?
所以我有这两个例子,来自javascript.info:
例1:
var animal = {
eat: function() {
alert( "I'm full" )
this.full = true
}
}
var rabbit = {
jump: function() { /* something */ }
}
rabbit.__proto__ = animal
rabbit.eat()
Run Code Online (Sandbox Code Playgroud)
例2:
function Hamster() { }
Hamster.prototype = {
food: [],
found: function(something) {
this.food.push(something)
}
}
// Create two speedy and lazy hamsters, then feed the first one
speedy = new Hamster()
lazy = new Hamster()
speedy.found("apple")
speedy.found("orange")
alert(speedy.food.length) // 2
alert(lazy.food.length) // 2 (!??)
Run Code Online (Sandbox Code Playgroud)
从示例2开始:当代码到达时 …
试图绕过Javascript对OO的看法......和许多其他人一样,对constructor财产产生混淆.特别是constructor财产的重要性,因为我似乎无法使其产生任何影响.例如:
function Foo(age) {
this.age = age;
}
function Bar() {
Foo.call(this, 42);
this.name = "baz";
}
Bar.prototype = Object.create(Foo.prototype);
var b = new Bar;
alert(b.constructor); // "Foo". That's OK because we inherit `Foo`'s prototype.
alert(b.name); // "baz". Shows that Bar() was called as constructor.
alert(b.age); // "42", inherited from `Foo`.
Run Code Online (Sandbox Code Playgroud)
在上面的例子中,对象b似乎有正确的构造函数call(Bar) - 并且它继承了age属性Foo.那么为什么许多人认为这是必要的步骤:
Bar.prototype.constructor = Bar;
Run Code Online (Sandbox Code Playgroud)
显然,Bar构造时会调用正确的构造函数b,因此这个原型属性有什么影响?我很想知道它实际上使构造函数属性设置'正确'有什么实际区别 - 因为我无法看到它对创建对象后实际调用的构造函数有任何影响.
在PHP/Java中可以做到:
class Sub extends Base
{
}
Run Code Online (Sandbox Code Playgroud)
并且Super类的所有公共/受保护方法,属性,字段等自动成为Sub类的一部分,必要时可以覆盖它.
Javascript中的等价物是什么?
javascript ×10
inheritance ×4
oop ×3
prototype ×3
constructor ×2
class ×1
ecmascript-6 ×1
new-operator ×1