小编Dav*_*ing的帖子

有没有人为什么其他优秀的jQuery.each功能设计与(现在)本机不同Array.forEach？F.ex:

var arr = ['abc','def'];
arr.forEach(function(entry, index) {
    console.log(entry); // abc / def
});

这绝对有道理.但jQuery选择将第index一个参数作为:

$.each(arr, function(index, entry) {
   console.log(entry);
});

有谁知道这个设计决定背后的原因？我一直在$.each广泛使用,但它总是告诉我索引是第一个参数,因为它很少使用.我知道jQuery实现了直接引用,this但是如果你这样做会很困惑:

?var arr = ['abc','def'];
$.each(arr, function() {
    console.log(this === 'abc'); // false both times, since this is a String constructor
});?????????????????????????????

并不是让我感到困扰,我更喜欢使用原生的polyfill来获得最常见的新数组函数,但我一直对设计决策感到好奇.也许它是在浏览器实现原生forEach和遗留支持之前的旧版本中制作的,无法阻止它们更改它,或者......？

或许,它是这样设计的,因为它也可以在本机对象上使用,然后将"键"放在回调值之前"有意义"？

旁注:我知道underscore.js(也许还有其他库)反过来(更类似于原生函数).

我遇到了将Array原型应用于本机对象的两种方法:

arr = Array.prototype.slice.call(obj);
arr = [].slice.call(obj);

以类似的方式,获取类似于本机数组的对象的真实类型:

type = Object.prototype.toString.call(obj);
type = {}.toString.call(obj);

一个简单的测试:

function fn() {
    console.log(
        Array.prototype.slice.call(arguments),
        [].slice.call(arguments),
        Object.prototype.toString.call(arguments), 
        {}.toString.call(arguments)
    );
}

fn(0,1);

小提琴:http://jsfiddle.net/PhdmN/

他们看起来和我一模一样; 第一种语法使用得更频繁,但第二种语法肯定更短.使用较短的语法时是否有任何缺点？

我使用此代码片段来阻止webkit在使用CSS转换时更改抗锯齿:

html{ -webkit-font-smoothing: antialiased; }

这适用于大多数情况,但是当我使用这个HTML玩Bootstrap时,我注意到了一些奇怪的问题:

<button class="btn btn-inverse">John Doe</button>
<a class="btn btn-inverse">John Doe</a>?

这就是它在OSX/Chrome中的外观:

小提琴:http://jsfiddle.net/hY2J7/.事实上,它似乎根本不适用于按钮.是否有更安全的技术在webkit中为所有元素触发相同的抗锯齿？

我想将交互控件放在youtube iframe视频上方,只需添加wmode=opaqueas参数然后将元素置于iframe上方,我就可以正常工作了.

我的问题是在移动设备上 - 控件首先工作正常,但是当我从全屏视频返回时,它们都被禁用了.它在桌面上工作正常.

HTML基本上是:

<iframe src="http://www.youtube.com/embed/[ID]?wmode=opaque"></iframe>
<button id="btn">Click me</button>

然后按钮位于iframe上方的绝对位置.

有关演示,请使用您的移动游览来访问此小提琴:http://jsfiddle.net/SwGH5/embedded/result/

您会看到该按钮在单击时会发出警报.现在,播放视频并单击"完成".然后尝试再次单击该按钮...

如果电影是使用<video>标签嵌入我可以听全屏结束事件并做一些事情,但现在我被卡住了......

这是小提琴:http://jsfiddle.net/SwGH5

使用js和/或jQuery创建动态样式标签的最佳方法是什么？

我试过这个:

var style= jQuery('<style>').text('.test{}');

这适用于FF,但在IE7"意外调用方法或属性访问"中弹出错误.

var style = document.createElement('style');
style.innerHTML='.test{}';

给出了同样的错误.如果我使用innerHTML或者无关紧要innerText.奇怪的是它在附加样式标记之前显示错误.

我怀疑它cssText与它有关,但我不确定如何.

使用Node.js的一个理论上的好处是可以在客户端和服务器之间共享相同的脚本.如果客户端不支持javascript,那么可以将相同的功能降级到服务器.

但是,Node.js require()方法可以自行运行.在您加载的脚本中,您可以添加内容this或exports稍后在获取脚本的对象中可用的内容:

var stuff = require('stuff');
stuff.show();

在stuff.js中:

this.show = function() {
    return 'here is my stuff';
}

因此,在客户端上重用此脚本时,该.show()方法将添加到window范围中.这不是我们想要的,而是我们想将它添加到自定义命名空间.

到目前为止我唯一的解决方案是(在stuff.js中):

var ns = typeof exports == 'undefined' ? (function() {
    return window['stuff'] = {};
})() : exports;

ns.show = function() {
    return 'here is my stuff';
}

delete ns; // remove ns from the global scope

这非常有效,因为我可以调用stuff.show()服务器和客户端.但它看起来古怪.我尝试寻找解决方案,但node.js仍然很新(甚至对我来说),所以几乎没有可靠的资源.有没有人对如何解决这个问题有更好的想法？

我想将一个简单的动态svg片段转换为服务器上的PNG数据URI.像这样的东西:

var svg = '<svg height="100" width="100"><circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" /></svg>'

console.log('<img src="data:image/png;base64,'+toPng(svg, 100, 100)+'">')

我见过使用imagemagick和一些phantomJS变种的例子,但我正在寻找node.js中的动态动态解决方案,最好是没有I/O.

当我从套接字获取新转储时,我需要替换我的observable对象中的数据:

class Store {
    @observable data = { foo: 'bar' }
    replaceFromDump(newData) {
        this.data = newData
    }
}
const store = new Store()
store.replaceFromDump({ foo: 'bar' })

// { foo: 'bar' } can be a huge amount of JSON

但是,我注意到数据对象扩展时的性能命中,可能是因为即使某些属性/值相同,MobX也会在任何地方触发反应.

有一种"更聪明"的方式吗？ - 我在想f.ex只替换对象的受影响部分会比替换整个observable更好吗？

我在这里做了一个小演示,解释了我的意思:https://jsfiddle.net/yqqxokme/.即使数据完全相同(预期),更换对象也会引起新的反应.但我确信有一种方法可以像在merge()函数中一样改变数据对象的受影响部分.

这不是一个真正的编码问题,而是一个现实世界的陈述.

前面我已经提到这DOMReady事件是慢,很慢.所以,我注意到在浏览jQuery源代码时可以触发jQuery domeready事件$.ready().然后我想,在关闭正文之前放置这个简单的执行脚本应该触发所有先前附加的"onDomReady"监听器.是的,它按预期工作:

     <script>$.ready()</script>
</body>

这里有两个例子,这个例子测量等待DOMReady时花费的ms:

http://jsbin.com/aqifon/10

正如您所看到的,DOMReady触发器本身非常慢,用户必须在domready脚本启动之前等待整整200-300毫秒.

无论如何,如果我们$.ready()在关闭BODY标签之前放置,我们得到这个:

http://jsbin.com/aqifon/16

看到不同？通过手动触发domready,我们可以切断100-300 ms的执行延迟.这是一个重要的交易,因为在我们看到它们之前,我们可以依赖jQuery来处理DOM操作.

现在,对于一个问题,我从未见过这个被推荐或讨论过,但它似乎仍然是一个主要的性能问题.一切都是关于优化代码本身的,这当然是好的,但是如果执行被延迟了很长时间以至于用户看到"flash of"unjQueryedContent",则是徒劳的."

有没有想过为什么不经常讨论/推荐这个？

type Foo = { [key: number]: string }

const foo: Foo = { 100: 'foo', 200: 'bar' }
const sizes: number[] = Object.keys(foo)

给我：

Type 'string[]' is not assignable to type 'number[]

为什么打字稿假设string[]？在这里创建数字数组的正确方法是什么？