Questions tagged «javascript»

可选链接（obj?.param1?.param2）似乎是一个很棒的功能，我真的很想看到它的实现，并最终摆脱了嵌套的ifs，任意函数以及如此简单的操作所不具备的功能。 但是有一个问题，它不起作用。我更新到节点12，但仍然收到错误： var dude = res?.param?.params[0] SyntaxError: Unexpected token '.' 要么 var dude = res.param?.params[0] SyntaxError: Unexpected token '.' 问题是什么？ 我是否需要更改某些语言配置或下载库才能启用此功能？还是根本还没有出来？

17 javascript  node.js 

如今，每个人都试图使用这类高阶函数以更少的代码获得有希望的结果。但是我不知道这些功能在内部如何工作。 假设我写类似 var numbers = [16, 25, 36]; var results = numbers.map(Math.sqrt); console.log(results); // [4, 5, 6] 运行代码段隐藏结果展开摘要 我知道'number'数组的每个元素都在一个一个地迭代，但是怎么做呢？ 我试图进行搜索，但没有得到满意的答复。

17 javascript  node.js  dictionary  higher-order-functions 

我指的是React Material-UI的文档（https://material-ui.com/components/autocomplete/）。 在演示代码中， <Autocomplete options={top100Films} getOptionLabel={(option: FilmOptionType) => option.title} style={{ width: 300 }} renderInput={params => ( <TextField {...params} label="Combo box" variant="outlined" fullWidth /> )} /> 我知道它是如何工作的，但是我不确定应该如何获得选定的值。 例如，我想onChange对此使用道具，以便我可以根据选择进行一些操作。 我尝试添加 onChange={v => console.log(v)} 但v不会显示与所选值相关的任何内容。

17 javascript  reactjs  material-ui 

我有一个简单的JSON，数组中包含其他对象等，如下所示： languagePack: [ { 'key': 'Username', 'value': 'Benutzername', 'group': 'default' }, { 'key': 'Password', 'value': 'Passwort', 'group': 'default' } ] 但是我真正想要的是这样的对象： languagePack: { 'Username': 'Benutzername', 'Password': 'Passwort' } 因此，我想将数组简化为数组甚至对象内部的简单键值对（键是唯一的）。有谁知道如何通过一些很棒的数组函数来减少这种情况？我只为每个对象想出了一个类似的东西，并为属性建立了“手工”对象的属性，但我记得数组中有一些很棒的东西，例如“ reduce”，散布运算符（...），map，一些，等等 我尝试了类似的东西： var temp = this.languagePack.map(([key, value]) => ({key,value})) console.log(temp) 但这只会给我一条错误消息 TypeError: Invalid attempt to destructure non-iterable instance 编辑：所有三个答案都工作正常。谢谢。

17 javascript  arrays 

我有一个列表，overflow-x并且overflow-y设置为auto。此外，我已经设置了动量滚动，因此使用可以在移动设备中很好地进行触摸滚动webkit-overflow-scrolling: true。 但是，问题在于，我无法弄清楚在垂直滚动时如何禁用水平滚动。这会导致非常糟糕的用户体验，因为向左上方或右上方滑动会导致表格沿对角线滚动。当用户垂直滚动时，我绝对不希望任何水平滚动，直到用户停止垂直滚动为止。 我尝试了以下方法： JS： offsetX: number; offsetY: number; isScrollingHorizontally = false; isScrollingVertically = false; //Detect the scrolling events ngOnInit() { this.scrollListener = this.renderer.listen( this.taskRows.nativeElement, 'scroll', evt => { this.didScroll(); } ); fromEvent(this.taskRows.nativeElement, 'scroll') .pipe( debounceTime(100), takeUntil(this.destroy$) ) .subscribe(() => { this.endScroll(); }); } didScroll() { if ((this.taskRows.nativeElement.scrollLeft != this.offsetX) …

17 javascript  html  css  angular  ionic-framework 

我想用CSS制作一个虚线圆，并通过以下过程创建它。 尽管可以通过此过程显示虚线圆，但虚线的末尾与起点之间的间隙变窄，并且间隙不均匀。 .c { width: 500px; height: 500px; border-width: 15px; border-style: dashed; border-radius: 600px; } <div class="c"></div> 运行代码段Hide results展开摘要 有没有办法使差距均匀？我们还能控制破折号之间的距离吗？ 如果单靠CSS无法做到这一点，我们正在考虑使用JavaScript或类似的工具。

16 javascript  html  css 

当使用带MessagePack的SignalR在JavaScript和C＃之间对值进行序列化和反序列化时，在接收端C＃中会看到一些精度损失。 作为示例，我将值0.005从JavaScript发送到C＃。当反序列化的值出现在C＃端时，我得到的0.004999999888241291是接近的值，但不是精确的0.005。JavaScript端的值是Number，我正在使用的C＃端的值double。 我已经读过JavaScript不能完全表示浮点数，这会导致类似的结果0.1 + 0.2 == 0.30000000000000004。我怀疑我看到的问题与JavaScript的此功能有关。 有趣的是，我没有看到相同的问题。从C＃向JavaScript发送0.005会在JavaScript中产生0.005的值。 编辑：从C＃的值只是在JS调试器窗口中缩短。正如@Pete所提到的，它确实扩展为不完全为0.5的值（0.005000000000000000104083408558）。这意味着差异至少发生在双方。 JSON序列化没有相同的问题，因为我假设它通过字符串传递，从而使接收环境留在控件中，从而将值解析为其原始数值类型。 我想知道是否有一种使用二进制序列化的方法来在两端都具有匹配的值。 如果不是，这是否意味着无法在JavaScript和C＃之间进行100％准确的二进制转换？ 使用的技术： 的JavaScript 带有SignalR和msgpack5的.Net Core 我的代码基于这篇文章。唯一的区别是我正在使用ContractlessStandardResolver.Instance。

16 javascript  c#  signalr  msgpack  binary-serialization 

我构建了一个相对较小的NPM包，每个包中包含大约5个不同的ES6类，它们看上去都非常像这样： export default class MyClass { // ... } 然后，我为我的包裹设置了一个入口点，如下所示： export { default as MyClass } from './my-class.js'; export { default as MyOtherClass } from './my-other-class.js'; 然后，我通过webpack和babel运行入口点，最后以经过编译和缩小的index.js结尾 安装和导入软件包可以正常工作，但是当我从客户端代码执行以下操作时： import { MyClass } from 'my-package'; 它不仅导入“ MyClass”，还导入整个文件，包括每个类的所有依赖关系（我的某些类具有很大的依赖关系）。 当您尝试导入已捆绑的软件包的一部分时，我想到了webpack是如何工作的？所以我也将我的本地webpack配置设置为也node_modules/my-package通过babel 运行，然后尝试： import { MyClass } from 'my-package/src/index.js'; 但是即使这样，它也会导入index.js导出的每个类。看来我想要的唯一运作方式是： import MyClass from 'my-package/src/my-class.js'; 但我宁愿： …

16 javascript  webpack  babeljs  es6-modules 

我有一张桌子，上面有数字。当我单击表格中的一个单元格时，它将切换活动状态。我想选择一个单元格，然后按crtl并选择另一个单元格，因此第一个和第二个之间的单元格将变为活动状态。如何执行呢？ codepen https://codepen.io/geeny273/pen/GRJXBQP <div id="grid"> <div class="cell">1</div> <div class="cell">2</div> <div class="cell">3</div> <div class="cell">4</div> <div class="cell">5</div> <div class="cell">6</div> </div> const grid = document.getElementById("grid") grid.onclick = (event) => { event.stopPropagation(); const { className } = event.target; if (className.includes('cell')) { if (className.includes('active')) { event.target.className = 'cell'; } else { event.target.className = 'cell active'; …

16 javascript  html  css 

我已经MyStyledButton基于material-ui 编写了一个自定义按钮（）Button。 import React from "react"; import { Button } from "@material-ui/core"; import { makeStyles } from "@material-ui/styles"; const useStyles = makeStyles({ root: { minWidth: 100 } }); function MyStyledButton(props) { const buttonStyle = useStyles(props); const { children, width, ...others } = props; return ( <Button classes={{ root: buttonStyle.root }} …

16 javascript  css  reactjs  jestjs  enzyme 

我有一个包含学生和家长地址的数组。 例如， const users = [{ id: 1, name: 'John', email: 'johnson@mail.com', age: 25, parent_address: 'USA', relationship:'mother' }, { id: 1, name: 'John', email: 'johnson@mail.com', age: 25, parent_address: 'Spain', relationship:'father' }, { id: 2, name: 'Mark', email: 'mark@mail.com', age: 28, parent_address: 'France', relationship:'father' } ]; 我正在尝试将其重新格式化为以下结果。 const list = [ …

16 javascript  arrays 

我有一个椭圆形的数据集，更具体地说是椭圆形的“信封”。我想知道是否有人建议我如何在D3地图上绘制这些图形。我已经有一个带有墨卡托投影的地图设置。这个stackoverflow答案有一个createEllipse函数，它使我关闭了，但是我想确保我正确地解释了数据。 我从数据中插入了椭圆的长/短轴值，并使用了旋转的方位角，这是正确的吗？我也不太了解“信封”部分。每个区域中的几个椭圆如何形成一个连续的形状？ 任何意见，将不胜感激。 const margin = {top:0, right:0, bottom:0, left:0}, width = 1000 - margin.left - margin.right, height = 800 - margin.top - margin.bottom; const svg = d3.select('body') .append('svg') .attr('width', '100%') .attr('height', '100%') .attr('viewBox', `0 0 ${width + margin.left + margin.right} ${height + margin.top + margin.bottom}`); const chart = svg.append('g') …

16 javascript  d3.js  geospatial 

让我的polyfill在Edge中工作时遇到了很大的麻烦。我尝试了各种尝试，但都没有按照文档进行操作。这似乎是有希望的。最后特别是那是行不通的。这是在vuex模块中发生的，因此我尝试将vuex添加到vue.config中的transpileDependencies，但是没有运气。 我的babel.config.js： module.exports = { presets: [['@vue/cli-plugin-babel/preset', { useBuiltIns: 'entry', }]], }; 在我的main.js中，最顶部有以下两个导入： import 'core-js/stable'; import 'regenerator-runtime/runtime'; 我的vue.config.js // eslint-disable-next-line import/no-extraneous-dependencies const webpack = require('webpack'); const isProd = process.env.NODE_ENV === 'production'; module.exports = { configureWebpack: { // Set up all the aliases we use in our app. plugins: [ new …

15 javascript  vue.js  vuejs2  babel  polyfills 

在以下示例中，我发现此关键字的值意外： let x = { z : 10 , get func1() { return function(v) { console.log(this === v); } } } x.func1(x) 运行代码段隐藏结果展开摘要 此关键字的值是对象x，就像它是从该对象执行的一样，我希望只有具有此关键字的get函数等于调用对象x 这个例子向我们展示了差异 let x = { func2() { return function(v) { console.log(this === v); } } } x.func2()(x); 运行代码段隐藏结果展开摘要 在两个示例中，都是从对象x执行的是getter函数func1和作为对象的方法的func2，然后执行返回的函数。那么，为什么在第一个示例中此值不等于全局对象而不是对象x。

15 javascript  getter-setter 

function andMultipleExpr(){ let logicalAnd; let i; for (i = 0; i < arguments.length; i++){ logicalAnd = arguments[i] && arguments[i+1]; } return logicalAnd; } console.log(andMultipleExpr(true, true, false, false)); 我期望执行此代码：true && true && false && false，并且应该返回false。 如何使它在js中工作？谢谢

15 javascript  function