你认为每个程序员都应该知道JavaScript的哪些“隐藏特性”?
在看到以下问题的优质答案后,我认为是时候向JavaScript请求它了。
HTML的隐藏特性 CSS的隐藏特性 PHP的隐藏特性 ASP的隐藏特性。网 c#的隐藏特性 Java的隐藏特性 Python的隐藏特性
尽管JavaScript可以说是目前最重要的客户端语言(问问谷歌就知道了),但令人惊讶的是,大多数web开发人员很少意识到它的强大。
你认为每个程序员都应该知道JavaScript的哪些“隐藏特性”?
在看到以下问题的优质答案后,我认为是时候向JavaScript请求它了。
HTML的隐藏特性 CSS的隐藏特性 PHP的隐藏特性 ASP的隐藏特性。网 c#的隐藏特性 Java的隐藏特性 Python的隐藏特性
尽管JavaScript可以说是目前最重要的客户端语言(问问谷歌就知道了),但令人惊讶的是,大多数web开发人员很少意识到它的强大。
当前回答
与。
它很少被使用,坦率地说,很少有用……但是,在有限的情况下,它确实有它的用途。
例如:对象字面量对于快速在新对象上设置属性非常方便。但是,如果需要更改现有对象的一半属性,该怎么办呢?
var user =
{
fname: 'Rocket',
mname: 'Aloysus',
lname: 'Squirrel',
city: 'Fresno',
state: 'California'
};
// ...
with (user)
{
mname = 'J';
city = 'Frostbite Falls';
state = 'Minnesota';
}
Alan Storm指出,这可能有点危险:如果用作上下文的对象没有被赋值的属性之一,它将在外部作用域被解析,可能会创建或覆盖一个全局变量。如果你习惯了用默认值或空值未定义的对象编写代码,这是特别危险的:
var user =
{
fname: "John",
// mname definition skipped - no middle name
lname: "Doe"
};
with (user)
{
mname = "Q"; // creates / modifies global variable "mname"
}
因此,避免使用with语句进行这种赋值可能是一个好主意。
请参见:JavaScript的“with”语句是否有合法用途?
其他回答
JavaScript typeof运算符用于数组或null总是返回对象值,在某些情况下可能不是程序员所期望的。
这里有一个函数,它将为这些项返回正确的值。数组识别复制自Douglas Crockford的书《JavaScript: The Good Parts》。
function typeOf (value) {
var type = typeof value;
if (type === 'object') {
if (value === null) {
type = 'null';
} else if (typeof value.length === 'number' &&
typeof value.splice === 'function' &&
!value.propertyIsEnumerable('length')) {
type = 'array';
}
}
return type;
}
合并操作符非常酷,可以生成一些干净简洁的代码,特别是当你将它们链接在一起时:a || b || c ||“default”;问题是,由于它是通过计算为bool而不是null来工作的,如果计算为false的值是有效的,它们通常会被忽略。不用担心,在这些情况下,只要恢复到好的三元操作符就可以了。
我经常看到代码已经放弃使用全局变量而不是静态变量,所以下面是如何(在一个我认为你可以称之为泛型单例工厂的例子中):
var getInstance = function(objectName) {
if ( !getInstance.instances ) {
getInstance.instances = {};
}
if ( !getInstance.instances[objectName] ) {
getInstance.instances[objectName] = new window[objectName];
}
return getInstance.instances[objectName];
};
另外,请注意新窗口[objectName];这是通过名称一般实例化对象的关键。我两个月前才算出来的。
本着同样的精神,在使用DOM时,当我第一次初始化我要添加的任何功能时,我经常将功能参数和/或标志埋藏在DOM节点中。如果有人抱怨,我再举个例子。
令人惊讶的是,第一页上没有人提到hasOwnProperty,这是一个遗憾。当使用in进行迭代时,在迭代的容器上使用hasOwnProperty方法以确保所使用的成员名是您所期望的成员名,这是一种很好的防御性编程。
var x = [1,2,3];
for ( i in x ) {
if ( !x.hasOwnProperty(i) ) { continue; }
console.log(i, x[i]);
}
阅读这里了解更多。
最后,with几乎总是一个坏主意。
您还可以使用前面提到的原型链spoon16扩展(继承)类和重写属性/方法。
在下面的例子中,我们创建了一个类Pet并定义了一些属性。我们还重写了继承自Object的. tostring()方法。
在此之后,我们创建了一个Dog类,它扩展了Pet并重写了. tostring()方法,再次改变了它的行为(多态性)。此外,我们还向子类添加了一些其他属性。
在此之后,我们检查继承链以显示Dog仍然是Dog类型、Pet类型和Object类型。
// Defines a Pet class constructor
function Pet(name)
{
this.getName = function() { return name; };
this.setName = function(newName) { name = newName; };
}
// Adds the Pet.toString() function for all Pet objects
Pet.prototype.toString = function()
{
return 'This pets name is: ' + this.getName();
};
// end of class Pet
// Define Dog class constructor (Dog : Pet)
function Dog(name, breed)
{
// think Dog : base(name)
Pet.call(this, name);
this.getBreed = function() { return breed; };
}
// this makes Dog.prototype inherit from Pet.prototype
Dog.prototype = new Pet();
// Currently Pet.prototype.constructor
// points to Pet. We want our Dog instances'
// constructor to point to Dog.
Dog.prototype.constructor = Dog;
// Now we override Pet.prototype.toString
Dog.prototype.toString = function()
{
return 'This dogs name is: ' + this.getName() +
', and its breed is: ' + this.getBreed();
};
// end of class Dog
var parrotty = new Pet('Parrotty the Parrot');
var dog = new Dog('Buddy', 'Great Dane');
// test the new toString()
alert(parrotty);
alert(dog);
// Testing instanceof (similar to the `is` operator)
alert('Is dog instance of Dog? ' + (dog instanceof Dog)); //true
alert('Is dog instance of Pet? ' + (dog instanceof Pet)); //true
alert('Is dog instance of Object? ' + (dog instanceof Object)); //true
这个问题的两个答案都是从Ray Djajadinata的一篇很棒的MSDN文章中修改的代码。
“JavaScript中的扩展方法”通过prototype属性。
Array.prototype.contains = function(value) {
for (var i = 0; i < this.length; i++) {
if (this[i] == value) return true;
}
return false;
}
这将为所有Array对象添加一个contains方法。您可以使用以下语法调用此方法
var stringArray = ["foo", "bar", "foobar"];
stringArray.contains("foobar");
let.
与var缺乏块作用域对应的是let,在JavaScript 1.7中引入。
The let statement provides a way to associate values with variables within the scope of a block, without affecting the values of like-named variables outside the block. The let expression lets you establish variables scoped only to a single expression. The let definition defines variables whose scope is constrained to the block in which they're defined. This syntax is very much like the syntax used for var. You can also use let to establish variables that exist only within the context of a for loop.
function varTest() {
var x = 31;
if (true) {
var x = 71; // same variable!
alert(x); // 71
}
alert(x); // 71
}
function letTest() {
let x = 31;
if (true) {
let x = 71; // different variable
alert(x); // 71
}
alert(x); // 31
}
截至2008年,FireFox 2.0+和Safari 3.x支持JavaScript 1.7。