小编Piw*_*oli的帖子

获得两个对象的交叉点的最佳方法是什么?

我有两个对象文字,如下:

var firstObject =
{
    x: 0,
    y: 1,
    z: 2,

    a: 10,
    b: 20,
    e: 30
}

var secondObject =
{
    x: 0,
    y: 1,
    z: 2,

    a: 10,
    c: 20,
    d: 30
}
Run Code Online (Sandbox Code Playgroud)

我想获得这两个对象文字的键的交集:

var intersectionKeys  = ['x', 'y', 'z', 'a']
Run Code Online (Sandbox Code Playgroud)

我显然可以做一个循环,看看另一个对象中是否存在具有相同名称的键,但我想知道这对于某些函数式编程和map/filter/reduce用法是否是一个好例子?我自己还没有完成那么多函数式编程,但我有一种感觉,对于这个问题可能存在一个干净而聪明的解决方案.

javascript big-o functional-programming intersection object

27
推荐指数
3
解决办法
2万
查看次数

如何在悬停时创建动画边框

我想在这个网站中创建一个悬停效果:

http://themes.creiden.com/circleflip/blog-with-sidebar/

只需将鼠标悬停在"更多"链接上即可.

http://joxi.ru/uXHGU_3JTJBkDpt35Iw

所以我试着这样做,但我只有这个变种

http://jsfiddle.net/TY8CQ/

码:

HTML

<a href="#">Click the link</a>
Run Code Online (Sandbox Code Playgroud)

CSS

body{
    padding: 100px;
    background: #f6f6f6;
}


a{
    display: block;
    width: 200px;
    position: relative;
    background: #fff;
    height: 40px;
    font: 14px/40px Tahoma;
    color: #39adf0;
    text-decoration: none;
    -webkit-transition: 0.2s;
    margin: auto;
    text-align: center;
    position: relative;
}

a:after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 1px;
    background: #39adf0;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -ms-transition: 0.2s;
    -o-transition: 0.2s;
    transition: 0.2s;

}

a:before{
    content: '';
    position: absolute;
    top: 0;
    right: …
Run Code Online (Sandbox Code Playgroud)

css jquery css3 css-transitions

8
推荐指数
2
解决办法
1万
查看次数

“修补”node_modules 模块的正确方法是什么?

假设我有一个 Node.js 应用程序,我们称之为patched-app。这个应用程序是一个简单的应用程序,它使用提示同步来请求用户输入,然后用它来做一些事情。

所以我们创建一个文件夹patched-app并用 初始化它npm init。然后,我们运行并创建一个名为“我的代码所在位置”npm i prompt-sync的新文件。index.js为了让事情变得更有趣,我还将在这里创建一个 git 存储库,这就是结果:

+---patched-app
|   |   .gitattributes
|   |   .gitattributes
|   |   .gitignore
|   |   index.js
|   |   package-lock.json
|   |   package.json
|   |   
|   +---node_modules
|   |   |   .package-lock.json
|   |   |   
|   |   +---ansi-regex
|   |   |       index.js
|   |   |       license
|   |   |       package.json
|   |   |       readme.md
|   |   |       
|   |   +---prompt-sync
|   |   | …
Run Code Online (Sandbox Code Playgroud)

patch node.js npm

7
推荐指数
1
解决办法
5262
查看次数

iOS 8.3 - 1.0以下的元视口初始比例导致在方向更改时出现奇怪的内容缩放

将我的iOS设备升级到iOS 8.3后,我注意到了meta视口初始缩放属性的一些奇怪行为.如果我将初始比例设置为1.0并在我在网页上时旋转我的设备,整个内容将逐渐变小,最终浏览器将崩溃.

我注意到,每次方向更改后内容的缩小量与您设置初始比例的程度有关.例如,如果我将其设置为0.9,则每次内容将减少10%.如果我将其设置为0.6,则每次内容将减少40%.

由于这个bug的性质,它不能在jsfiddle上放置或体验.相反,我会将代码粘贴到此处,以便您可以在某处自行测试:

<!doctype html>
<html>
    <head>
        <title>initial scale under 1.0</title>
        <meta name="viewport" content="width=device-width, initial-scale=0.7, user-scalable=0" />
    </head>
    <body>
        <div id = "wrapper">
            <h1>Hello, run this page on iOS 8.3 device and change the orientation multiple times to make this text go smaller and eventually crash the browser!</h1>
        </div>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

您可以将该破坏的示例与工作的示例进行比较,该示例的初始比例设置为1.0:

<!doctype html>
<html>
    <head>
        <title>initial scale 1.0</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0" />
    </head>
    <body>
        <div id = "wrapper">
            <h1>This text will not get smaller nor will …
Run Code Online (Sandbox Code Playgroud)

html mobile viewport ios web

5
推荐指数
1
解决办法
1051
查看次数

为什么 Google Maps JavaScript API (v3) 不使用画布?

为什么 Google Maps JavaScript API 使用 DIV 来呈现所有内容?这似乎是 iOS 上的性能问题。此外,为什么官方的谷歌地图使用画布?

一段时间以来,我一直试图在谷歌上搜索这个问题的答案。似乎 Google Maps API 根本不支持地图的画布渲染。它坚持使用和转换 div。同时,如果我访问官方的 Google Maps 应用程序,它确实使用画布进行地图渲染。

有没有办法在画布上渲染所有内容,或者我在这里缺少什么?

编辑:我自己在评论中的回答。简而言之,公共 Google Maps JavaScript API (v3) 根本不存在画布渲染。Google 官方地图使用名为 MapsGL 的 Google 实验,该实验尚未公开。至于为什么谷歌地图 API 不支持画布——我最好的猜测是,在公共 API 出现时,使用硬件加速的 div-system 是唯一的选择。

javascript google-maps canvas google-maps-api-3

5
推荐指数
0
解决办法
592
查看次数

绕过 &lt;head&gt; 中的对象冻结(受到广泛保护的网站)

背景

我遇到过一个带有广告横幅的网站。当广告拦截或类似内容删除横幅元素时,网站会重新发送alerts有关无法加载广告的垃圾邮件,从而使观看体验比广告更糟糕。

我喜欢修补并尝试打破网站上的这些“保护”,但是,此时我没有想法。

该网站似乎总体上采用了广泛的保护措施来防止篡改,因此,虽然这个问题“简单地”是关于在头部完成对象冻结的操作,但如何做到这一点存在多种限制。

问题

首先,我不想通过对横幅做一些特殊的事情来解决这个问题,例如使它们可见而不是删除它们。我想攻击alert.

问题是,当网站加载其 时index.html,它会冻结window.alert该部分中的对象,<head>如下所示:

<script>
    Object.defineProperty(window, 'alert', {
        configurable: false,
        writable: false
    })
</script>
Run Code Online (Sandbox Code Playgroud)

之后就不可能这样做了,例如:

window.alert = null;

鉴于我们无法触及警报本身,人们可能会考虑尝试查找并删除对警报的调用......

...不幸的是,这似乎也是不可能的,因为如果没有 JavaScript,网站将无法工作,并且网站使用CSRF-token加载其余脚本。所有加载的脚本还在每个请求中使用 CSRF 令牌。

该网站最初在头部加载一个“加载器脚本”,并且它受到原始策略的保护,因此无法从其他任何地方提供该脚本。该加载器脚本本身使用 CSRF 令牌通过 XMLHttpRequest 加载其余脚本。

还有内容安全策略标头。

这实质上意味着不可能例如让网络服务器充当代理来加载网页、剥离头部中的冻结脚本并传递修改后的网页。至少据我所知 - 据我所知,这正是 CSRF 令牌所阻止的。

我在哪里

我正在使用一个名为Resource Override的 Chrome 扩展,它可以让我:

  • 为网站设置基于正则表达式的规则和操作
  • 进一步设置基于正则表达式的 URL 规则和网站请求某些特定 URL 时的操作
  • “响应”网站发出的任何请求并响应,例如本地提供的文件,但限制是这个本地提供的文件显然会因需要 CSRF 令牌的所有内容而失败
  • 只要网站已加载,就可以在网站的任何位置注入 JavaScript
  • 修改请求和响应头

在头部注入js

对我来说,显而易见的第一步就是简单地将 a 注入window.alert = null到 …

javascript xss google-chrome csrf content-security-policy

5
推荐指数
1
解决办法
424
查看次数

有没有办法为 HTML5 输入的模式属性应用正则表达式修饰符?

HTML规范中有这个片段,但要么我不理解规范,要么它没有完全说明关于正则表达式修饰符的任何信息。

html javascript regex validation input

3
推荐指数
1
解决办法
1330
查看次数

Python collections.Counter似乎打破了原始列表

码:

sortedgroups = sorted(metagroups, key=lambda group: group[-1])
categories = map(operator.itemgetter(-1), sortedgroups)
categorycounts = collections.Counter(categories)

print('Writing output files')

with open('report.txt', 'a+') as f:
    for category in categories:
        f.write(category + '\n')
Run Code Online (Sandbox Code Playgroud)

所以如果我注释掉这个代码就行了:

categorycounts = collections.Counter(categories)
Run Code Online (Sandbox Code Playgroud)

如果我尝试计算类别列表中相同字符串的数量,for循环似乎会中断.是否collections.Counter()修改原始类对象?

python collections list

2
推荐指数
1
解决办法
47
查看次数

我可以为函数绑定除"this"之外的其他内容吗?

我需要将外部变量传递给jQuery Ajax的success-function.我的ajax像这样循环:

var props = ['a', 'b', 'c'];

var results = 
{
    a: null,
    b: null,
    c: null
};

for(var key in props)
{
    var prop = props[key];

    $.ajax(
    {
        url: 'someurl',

        data:
        {
            somedata: 'somevalue'
        },

        success: function(data, status, xhr)
        {
            // This here does not work properly, because the prop's value changes
            // Due to promise stuff
            results[prop] = data;  
        }
    });
}
Run Code Online (Sandbox Code Playgroud)

我需要将成功返回的数据填充到正确的位置,但上面的实现不起作用,因为prop调用成功之前的更改值.

我发现我可以通过将成功函数与支柱绑定来"绕过"这个问题,如下所示:

success: function(data, status, xhr)
{
    results[this] = data;  
}.bind(prop)
Run Code Online (Sandbox Code Playgroud)

但这似乎不是一个好主意,此外,我只能绑定一个变量,而不是多个,如果需要的话.

这似乎也不起作用: …

javascript ajax jquery

2
推荐指数
1
解决办法
69
查看次数

JavaScript 中最简单的自修改函数?

我想研究和摆弄自修改函数,并知道 JavaScript 具有eval和其他有趣的反射特性,例如使函数从内部打印其主体,我想我想做一些自修改函数测试使用 JavaScript。

我想要一个简单的函数,当被调用时,它会根据任何规则修改自身。

就像也许某个函数可以先执行一个简单的操作console.log,然后下次调用它时它就会执行此操作alert。这显然可以通过 来实现if,但我在这里寻找的是实际的物理函数首先应该如下所示:

function selfm()
{
    console.log('hello')
    // + modify self here somehow
}
Run Code Online (Sandbox Code Playgroud)

第一次通话后:

function selfm()
{
    alert('hello')
}
Run Code Online (Sandbox Code Playgroud)

我怎样才能以最简单的形式实现这种行为?

javascript reflection eval function self-modifying

2
推荐指数
1
解决办法
2697
查看次数

如何动态绘制“漂亮”的贝塞尔曲线?

我做了一个小小提琴:https://jsfiddle.net/ahvonenj/yp0o728h/

您可以按下左键单击来移动红色圆圈,并且更新两点之间绘制的贝塞尔曲线,但不是以我希望的方式工作。

我想动态计算控制点,使曲线看起来像这样:

案例一:在此输入图像描述

情况B:在此输入图像描述

情况C:在此输入图像描述

所以基本上我希望曲线总是从 A 点到 B 点形成一条小的、“漂亮”的曲线,无论这些点如何定位。画一条直线看起来不太漂亮,所以我想使用贝塞尔曲线使线稍微弯曲。

问题在于计算控制点位置。这是如何实现的,有没有一种简单的方法可以做到这一点,因为我已经看到许多应用程序似乎到处都使用动态贝塞尔曲线。

由于 jsfiddle-links 需要附带代码,因此以下是当前使用静态控制点绘制贝塞尔曲线的行:

ctx.bezierCurveTo(20, 100, 200, 100, c2.x, c2.y);
Run Code Online (Sandbox Code Playgroud)

我希望我不必进行大量计算来得出控制点位置。

javascript bezier canvas

0
推荐指数
1
解决办法
1595
查看次数