Tag: JavaScript

我的JavaScript模式/实践太臭了。 我应该在哪里寻求帮助？

过去几年来，我几乎一直在完成后端任务，而且我刚刚注意到，大多数JavaScript（和CoffeeScript）项目在我缺席的情况下都变得更漂亮了。 我主要在一个rails环境中工作，几乎所有的JavaScript / jQuery看起来都像这样： $(an_element).an_event(function() { stuff_i_want_to_do; }) $(another_element).some_other_event(function() { some_other_stuff_i_want_to_do; }) 除了callback之外，就是这样。 无论如何，只是浏览其他人的代码，并注意到许多javascripters在我不在的时候变得更漂亮了。 这并不复杂，但是我已经看到了更新/更好的JavaScript方法。 jQuery -> if $('#products').length new ProductsPager() class ProductsPager constructor: (@page = 1) -> $(window).scroll(@check) check: => if @nearBottom() @page++ $(window).unbind('scroll', @check) $.getJSON($('#products').data('json-url'), page: @page, @render) # nearBottom: => $(window).scrollTop() > $(document).height() – $(window).height() – 50 render: (products) => for product […]

Chrome开发者工具自更新32.0.1700.76 m以来未响应

Chrome本身似乎工作正常，但我遇到与开发工具的问题。 经过一段时间它变得没有反应，并popup下面的对话框… 这是一个已知的错误，可以或将会很快被修复吗？ 另外，同时我应该怎么做，我怎样才能回滚到旧的工作版本的Chrome？ 我广泛使用Chrome和开发工具，这是一个令人头痛的问题，所以任何build议都会受到欢迎。

使用Jasmine监听构造函数

我正在使用Jasmine来testing是否创build了某些对象，并调用方法。 我有一个jQuery小部件，创buildflipcounter对象，并调用setValue方法。 flipcounter的代码在这里： https ://bitbucket.org/cnanney/apple-style-flip-counter/src/13fd00129a41/js/flipcounter.js flipcounters创build使用： var myFlipCounter = new flipCounter("counter", {inc: 23, pace: 500}); 我想testingflipcounters是否被创build，并调用setValue方法。 我的问题是，如何在这些对象被创build之前监视它们？ 我是否监视构造函数并返回假对象？ 示例代码真的有帮助。 谢谢你的帮助！ 🙂 更新： 我试过这样的flipCounter间谍： myStub = jasmine.createSpy('myStub'); spyOn(window, 'flipCounter').andReturn(myStub); //expectation expect(window.flipCounter).toHaveBeenCalled(); 然后通过flipCountertestingsetValue调用： spyOn(myStub, 'setValue'); //expectation expect(myStub.setValue).toHaveBeenCalled(); 初始化flipCounter的第一个testing是好的，但为了testingsetValue调用，所有我得到的是一个'setValue（）方法不存在'的错误。 我是这样做的吗？ 谢谢！

如何在AngularJS中使用jQuery

我正在尝试使用简单的jQuery UI。 我已经包括了一切，我有这个简单的脚本： <script> $(function() { $( "#slider" ).slider(); }); </script> 和 <div id="slider"></div> 我包括： <script type="text/javascript" src="js/jquery-1.10.2.js"></script> <script type="text/javascript" src="js/jquery-ui-1.10.4.custom.min.js"></script> <script type="text/javascript" src="js/jquery.easing.1.3.js"></script> <script type="text/javascript" src="js/ayaSlider.js"></script> <script type="text/javascript" src="js/bootstrap.min.js"></script> <script type="text/javascript" src="js/angular.min.js"></script> <script type="text/javascript" src="js/angular-route.min.js"></script> <script type="text/javascript" src="js/app.js"></script> 但是，当我打开页面没有滑块。 根据angular的文件： 如果jQuery可用，angular.element是jQuery函数的别名。 如果jQuery不可用，angular.element委托给Angular的jQuery内置子集。 但是，我真的不知道如何使用angular.element ，没有例子。 更新：我设法在屏幕上有滑块，但它不起作用，我不能改变值或做一些事情。

从本身内部引用javascript函数

考虑这段代码 var crazy = function() { console.log(this); console.log(this.isCrazy); // wrong. } crazy.isCrazy = 'totally'; crazy(); // ouput => // DOMWindow // undefined 从疯狂（）里面'这个'是指这个窗口，我猜是有道理的，因为通常你会想要这个引用函数附加到的对象，但是我怎样才能让函数引用自己，并且访问一个属性本身？ 回答： 不要使用arguments.callee，只是使用一个命名函数。 “注意：你应该避免使用arguments.callee（）并且给每个函数（expression式）一个名字。” 通过arguments.callee上的MDN文章

最好的C＃JavaScript翻译

我正在寻找好的引擎，能够将C＃源代码翻译成JavaScript模拟。

如何安全地包装`console.log`？

假设我想包含一些调用console.log的一些合法的生产原因，比如说unit testing工具。 显然，如果浏览器没有console ，或者没有控制台 ，我不希望这个引发过早的exception。 创build一个简单的logfunction将日志logging到控制台的最好方法是什么，或者如果没有控制台存在，就会在没有错误的情况下悄然失败？ 上面提到的问题被接受的答案是： var log = Function.prototype.bind.call(console.log, console); log.apply(console, ["this", "is", "a", "test"]); 这个logfunction可以在IE上正常调用，这里的apply只是为了显示它是可能的？ 而且，我从关联的问题中推测，如果IE的控制台在运行时closures，那么这样做会失败，所以即使在控制台打开后， log也不能正常工作。 如果这是错的，有人可以解释它是如何工作的？ 这ycombinator文章似乎相关。 他们是否正在谈论与上面链接的问题相同的IE行为？ Function.prototype.apply.apply(console.log, [console, arguments]); 在IE9破坏console.log和其他供应商的常规console.log上都可以。 与使用Array.prototype.slice将参数转换为实数组相同。 这在我的Chrome控制台中很好地工作。 function echo(){ Function.prototype.apply.apply(console.log, [console, arguments]); } 简化： function echo(){ Function.apply.call(console.log, console, arguments); } 添加支票并返回： function echo(){ return window.console && console.log && Function.apply.call(console.log, console, arguments); } 上面的例子对我来说足够了。 […]

为什么在使用babel-loader的时候Object.assign（）需要一个polyfill？

我正在尝试在由webpack编译的Babel编译的ES6 Web应用程序中使用Object.assign() ，但是出现错误： Uncaught TypeError: Object.assign is not a function 我已经使用babel-loader将ES6转换为ES5，所以我所有的其他ES6代码都可以正常工作。 然而， Object.assign()只在我的代码库中import "babel-core/polyfill"之后才起作用。 我看到我也可以通过导入babel-runtime来解决这个问题，但是我想知道为什么 Object.assign()需要比babel-loader执行 – 不应该使用babel-loader预处理所有东西，包括Object.assign() ？

为什么{{undefined + number}}返回数字？

我正在开发一个AngularJS项目。 我注意到下面的expression式返回一个数字。 在视图中， {{undefined + 10}}将输出10。 在JavaScript中， undefined + 10将输出NaN 。 为什么在一个视图中这种行为是不同的？

如何使用CSS（和JavaScript？）创build一个模糊的“磨砂”背景？

我正在尝试用HTML5，CSS3和JavaScript来创build一个可以在webkit浏览器上工作的iOS 7风格的磨砂外观。 从技术上讲，给以下的HTML： <style> #partial-overlay { width: 100%; height: 20px; background: rgba(255, 255, 255, .2); /* TODO frost */ position: fixed; top: 0; left: 0; } </style> <div id="main-view"> <div style="width: 50px; height: 50px; background: #f00"></div> To my left is a red box<br> Now there is just text<br> Text that goes on for a few […]