nk前端篇-JS能力测评js1

JS
- JS1 **直角三角形**
- JS2 **文件扩展名**
- JS3 **分隔符**
- JS4 **单向绑定**
- JS5 **创建数组**
- JS6 **判断版本**
- JS7 **无重复数组**
- JS8 **数组排序**
- JS9 **新数组**
- JS10 **计数器**
- JS11 **列表动态渲染**
- JS12 **模板字符串**
- JS13 **类继承**
- JS14 **参数解析器**
- JS15 **生成页码**
- JS16 **总成绩排名**
- JS17 **子字符串频次**
- JS18 **继承**
- JS19 **判断斐波那契数组**
- JS20 **数组扁平化**
- JS21 **数组过滤**
- JS22 **判断质数**
- JS23 **验证是否是身份证**
- JS24 **Symbol**
- JS25 **相同的Set**
- JS26 **Getter**
- JS27 **控制动画**
- JS28 **Map保存节点**
- JS29 **全选**
- JS30 **回文字符串**
- JS31 **Proxy计数器**
- JS32 **Proxy拦截器**
- JS33 **监听对象**
总结
更多

JS

JS1 直角三角形

请补全JavaScript代码，要求在页面上渲染出一个直角三角形，三角形换行要求使用"br"实现。三角形如下：

*
**
***

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"></head><body><div class='triangle'></div><script>var triangle = document.querySelector('.triangle');// 补全代码triangle.innerHTML = "*<br>**<br>***"</script></body>
</html>

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"></head><body><div class='triangle'></div><script>var triangle = document.querySelector('.triangle');// 补全代码let str = ''for(var i = 0;i < 4;i++){for(var j = 0;j < i;j++){str += `*`}str += `<br>`}triangle.innerHTML = str</script></body>
</html>

JS2 文件扩展名

请补全JavaScript代码，要求以字符串的形式返回文件名扩展名，文件名参数为"filename"。

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"></head><body><script>const _getExFilename = (filename) => {// 补全代码return "." + filename.split('.')[1]}</script></body>
</html>

JS3 分隔符

请补全JavaScript代码，要求返回参数数字的千分位分隔符字符串。

示例1

输入：_comma(12300)

输出：‘12,300’

<!DOCTYPE html>
<html><head><meta charset=utf-8></head><body><script type="text/javascript">function _comma(number) {// 补全代码number = (''+ number).replace(/\d{1,3}(?=(\d{3})+$)/g,(val)=>val+',')return number;}</script></body>
</html>

function _comma(number) {// 补全代码let arr = Math.abs(number).toString().split('').reverse();let i = 3;while (i < arr.length) {arr.splice(i, 0, ',');i += 4;}let str = arr.reverse().join('');return number >= 0 ? str : '-' + str;
}

JS4 单向绑定

请补全JavaScript代码，要求每当id为"input"的输入框值发生改变时触发id为"span"的标签内容同步改变。
注意：
\1. 必须使用DOM0级标准事件（onchange）

<body><input id="input" type="text" /><span id="span"></span><script type="text/javascript">// 补全代码input = document.querySelector('#input')span = document.getElementById('span')input.onchange=function(){span.innerText = input.value}</script></body>

或

input.onchange=function(){span.innerHTML = input.value}

JS5 创建数组

请补全JavaScript代码，要求返回一个长度为参数值并且每一项值都为参数值的数组。
注意：请勿直接使用for/while

        <script type="text/javascript">const _createArray = (number) => {// 补全代码return Array(number).fill(number)}</script>

JS6 判断版本

请补全JavaScript代码，该函数接收两个参数分别为旧版本、新版本，当新版本高于旧版本时表明需要更新，返回true，否则返回false。
注意：
\1. 版本号格式均为"X.X.X"
\2. X∈[0,9]
\3. 当两个版本号相同时，不需要更新

        <script type="text/javascript">const _shouldUpdate = (oldVersion, newVersion) => {// 补全代码let oldV = Number(oldVersion.split('.').join(''))let newV = Number(newVersion.split('.').join(''))if(oldV < newV){return true}else{return false}}</script>

JS7 无重复数组

请补全JavaScript代码，实现一个函数，要求如下：
\1. 根据输入的数字范围[start,end]和随机数个数"n"生成随机数
\2. 生成的随机数存储到数组中，返回该数组
\3. 返回的数组不能有相同元素
注意：
\1. 不需要考虑"n"大于数字范围的情况

示例1

输入：getUniqueNums(2,10,4)

输出：[4,6,2,8]

        <script>const _getUniqueNums = (start,end,n) => {// 补全代码if(n > end - start + 1)   return []let res = []for(let i = 0;i < n;i++){let numdo{num = Math.floor(Math.random() * (end - start + 1)) + start}while(res.includes(num))res.push(num)}return res;}</script>

//start-end之间的随机整数求解方法:
Math.floor(Math.random()*(max-min+1))+min

JS8 数组排序

请补全JavaScript代码，根据预设代码中的数组，实现以下功能：
\1. 列表只展示数组中的name属性
\2. 实现点击"销量升序"按钮，列表内容按照销量升序重新渲染
\3. 实现点击"销量降序"按钮，列表内容按照销量降序重新渲染
注意：
\1. 必须使用DOM0级标准事件（onclick）

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"></head><body><button class='up'>销量升序</button><button class='down'>销量降序</button><ul></ul><script>var cups = [{ type: 1, price: 100, color: 'black', sales: 3000, name: '牛客logo马克杯' },{ type: 2, price: 40, color: 'blue', sales: 1000, name: '无盖星空杯' },{ type: 4, price: 60, color: 'green', sales: 200, name: '老式茶杯' },{ type: 3, price: 50, color: 'green', sales: 600, name: '欧式印花杯' }]var ul = document.querySelector('ul');var upbtn = document.querySelector('.up');var downbtn = document.querySelector('.down');// 补全代码let up = function(){return cups.sort((a,b) => {return a.sales - b.sales})}let down = function(){return cups.sort((a,b) => {return b.sales - a.sales})}let render = function(){let str = ''for(let i = 0;i < cups.length;i++){str += '<li>' + cups[i].name + '</li>';}ul.innerHTML = str;}upbtn.onclick = function(){up()render()}downbtn.onclick = function(){down()render()}</script></body>
</html>

JS9 新数组

请补全JavaScript代码，该函数接受两个参数分别为数组、索引值，要求在不改变原数组的情况下返回删除了索引项的新数组。

        <script type="text/javascript">const _delete = (array,index) => {// 补全代码let res = JSON.parse(JSON.stringify(array))res.splice(index,1)return res}</script>

        <script type="text/javascript">const _delete = (array,index) => {// 补全代码let res = []for(let i = 0;i < array.length;i++){if(i != index){res.push(array[i])}}return res}</script>

JS10 计数器

请补全JavaScript代码，要求每次调用函数"closure"时会返回一个新计数器。每当调用某个计数器时会返回一个数字且该数字会累加1。
注意：
\1. 初次调用返回值为1
\2. 每个计数器所统计的数字是独立的

        <script type="text/javascript">const closure = () => {// 补全代码var count = 0return function(){count++return count}}</script>

JS11 列表动态渲染

请补全JavaScript代码，将预设代码中的"people"数组渲染在页面中。实现下面的列表：

牛油1号 20岁
牛油2号 21岁
牛油3号 19岁

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"></head><body><ul></ul><script>var people = [{ name: '牛油1号', id: 1, age: 20 },{ name: '牛油2号', id: 2, age: 21 },{ name: '牛油3号', id: 3, age: 19 },]var ul = document.querySelector('ul');// 补全代码people.map((item) => {ul.innerHTML += `<li>${item.name} ${item.age}岁</li>`});</script></body>
</html>

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"></head><body><ul></ul><script>var people = [{ name: '牛油1号', id: 1, age: 20 },{ name: '牛油2号', id: 2, age: 21 },{ name: '牛油3号', id: 3, age: 19 },]var ul = document.querySelector('ul');// 补全代码for (let i = 0; i < people.length; i++) {let lis = document.createElement('li');lis.innerHTML = people[i].name + " " +  people[i].age + '岁';ul.appendChild(lis);}</script></body>
</html>

JS12 模板字符串

请补全JavaScript代码，实现以下功能：
\1. 根据已有的person对象的注册时间求出距离当前时间的天数（天数向下取整）。
\2. 将获得的天数和person数据拼接成字符串，作为h2标签的内容。
注意：使用模板字符串进行字符串拼接，字符串最终内容如：尊贵的牛客网2级用户小丽您好，您已经注册牛客网3天啦~

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"></head><body><h2></h2><script>var person = {level: '2',name: '小丽',registTime: '2021-11-01',}var h2 = document.querySelector('h2');// 补全代码let date = new Date();let now = date.getTime();let start = new Date(person.registTime).getTime();let temp = now - start;let days = Math.floor(temp / (24 * 60 * 60 *1000));h2.innerText = `尊贵的牛客网${person.level}级用户${person.name}您好，您已经注册牛客网${days}天啦~`;</script></body>
</html>

JS13 类继承

请补全JavaScript代码，完成类的继承。要求如下：
\1. "Chinese"类继承于"Human"类
\2. “Human"类实现一个函数"getName”，返回该实例的"name"属性
\3. “Chinese"类构造函数有两个参数，分别为"name”、“age”
\4. “Chinese"类实现一个函数"getAge”，返回该实例的"age"属性

<!DOCTYPE html>
<html><head><meta charset=utf-8></head><body><script type="text/javascript">class Human {constructor(name) {this.name = namethis.kingdom = 'animal'this.color = ['yellow', 'white', 'brown', 'black']}// 补全代码getName(){return this.name;}}// 补全代码class Chinese extends Human{constructor(name,age){super(name);this.age = age;}getAge(){return this.age;}}</script></body>
</html>

JS14 参数解析器

请补全JavaScript代码，要求将字符串参数URL中的参数解析并以对象的形式返回。

示例1

输入：

getParams('https://nowcoder.com/online?id=1&salas=1000')

输出：

{id:1, salas: 100}

        <script>const _getParams = (url) => {// 补全代码let obj = {}let urlArr = url.split('?')[1].split('&')urlArr.forEach(item => {let itemArr = item.split('=')obj[itemArr[0]] = itemArr[1]})return obj}</script>

        <script>const _getParams = (url) => {// 补全代码let obj = {}let urlArr = url.split('?')[1].split('&')for(var i = 0;i < urlArr.length;i++){      var temp = urlArr[i].split('=')obj[temp[0]]=temp[1]}return obj}</script>

JS15 生成页码

请补全JavaScript代码，要求根据参数动态生成"li"标签页码并插入"ul"标签下。要求如下：
\1. "allItem"为总数据项个数，"pageItem"为每页的数据项个数
\2. "li"标签内容为当前页码数，页码从1开始

示例1

输入：

_createPage(13,2)

输出：

"li"长度为7，"li"内容依次为"1","2","3","4","5","6","7"

<!DOCTYPE html>
<html><head><meta charset=utf-8></head><body><ul id="ul"></ul><script type="text/javascript">const _createPage = (allItem, pageItem) => {// 补全代码let ulbox = document.querySelector('#ul')let page = Math.ceil(allItem / pageItem)let html = ''for(let i = 1; i <= page;i++){html += `<li>${i}</li>`}ulbox.innerHTML = html}</script></body>
</html>

JS16 总成绩排名

请补全JavaScript代码，要求将数组参数中的对象以总成绩(包括属性"chinese"、“math”、“english”)从高到低进行排序并返回。

        <script type="text/javascript">const _rank = array => {// 补全代码array.sort((a,b) => {let left = a.chinese + a.math + a.englishlet right = b.chinese + b.math + b.englishreturn right - left})return array}</script>

JS17 子字符串频次

请补全JavaScript代码，该函数接受两个参数分别为字符串、子字符串，要求返回子字符串在字符串中出现的频次。

        <script>const _searchStrIndexOf = (str, target) => {// 补全代码let arr = str.split(target)   //字符串分割return arr.length - 1}</script>

JS18 继承

请补全JavaScript代码，实现以下功能：
\1. 给"Human"构造函数的原型对象添加"getName"方法，返回当前实例"name"属性
\2. 将"Chinese"构造函数继承于"Human"构造函数
\3. 给"Chinese"构造函数的原型对象添加"getAge"方法，返回当前实例"age"属性

        <script type="text/javascript">function Human(name) {this.name = namethis.kingdom = 'animal'this.color = ['yellow', 'white', 'brown', 'black']}function Chinese(name,age) {Human.call(this,name)this.age = agethis.color = 'yellow'}// 补全代码Human.prototype.getName = function(){return this.name;};Chinese.prototype = new Human();Chinese.prototype.constructor = Chinese;Chinese.prototype.getAge = function(){return this.age;}</script>

JS19 判断斐波那契数组

请补全JavaScript代码，要求以Boolean的形式返回参数数组是否为斐波那契数列。在数学上，斐波那契数列以如下方法定义：F(0)=0，F(1)=1, F(n)=F(n - 1)+F(n - 2)（n ≥ 2，n ∈ N）
注意：
\1. [0,1,1]为最短有效斐波那契数列

        <script type="text/javascript">const _isFibonacci = array => {// 补全代码if(array.length < 3)    return false;let a = 0,b = 1,c = a + b;for(let i = 0;i < array.length;i++){if(array[i] != a)    return false;a = b;b = c;c = a + b;}return true;}</script>

        <script type="text/javascript">const _isFibonacci = array => {// 补全代码if(array.length < 3)    return false;for(let i = 2;i<array.length;i++){if(array[i-2]+array[i-1] != array[i]){return false}}return true;}</script>
//F(n)=F(n - 1)+F(n - 2)规律符合，但F(0)=0，F(1)=1没有判断

JS20 数组扁平化

请补全JavaScript代码，要求将数组参数中的多维数组扩展为一维数组并返回该数组。
注意：
\1. 数组参数中仅包含数组类型和数字类型

示例1

输入：[1,[2,[3,[4]]]]

输出：[1,2,3,4]

        <script>const _flatten = arr => {// 补全代码let res = []for(let i = 0;i < arr.length;i++){if( typeof(arr[i]) == 'number'){res.push(arr[i])}else{arr = arr[i];i = -1;}}return res}</script>

JS21 数组过滤

请补全JavaScript代码，要求根据下拉框选中的条件变换重新渲染列表中展示的商品，且只展示符合条件的商品。
注意：
\1. 必须使用DOM0级标准事件（onchange）
\2. 建议使用ES6的filter方法

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"></head><body><select name="" id=""><option value="0">请选择销量范围</option><option value="1">&lt100</option><option value="2">100~500</option><option value="3">&gt500</option></select><ul><li>牛客logo马克杯</li><li>无盖星空杯</li><li>老式茶杯</li><li>欧式印花杯</li></ul><script>var cups = [{ type: 1, price: 100, color: 'black', sales: 60, name: '牛客logo马克杯' },{ type: 2, price: 40, color: 'blue', sales: 100, name: '无盖星空杯' },{ type: 4, price: 60, color: 'green', sales: 200, name: '老式茶杯' },{ type: 3, price: 50, color: 'green', sales: 600, name: '欧式印花杯' }]var select = document.querySelector('select');var ul = document.querySelector('ul');// 补全代码function selectS(ul,cups){ul.innerHTML = ''cups.forEach(item => {let li = document.createElement('li')li.innerHTML = item.nameul.append(li)})}select.onchange = function(e){let value = this.valueif(value == 1){let _cups = cups.filter(cup => cup.sales < 100)selectS(ul,_cups)}else if(value == 2){let _cups = cups.filter(cup => cup.sales >= 100 && cup.sales <= 500)selectS(ul,_cups)}else if(value == 3){let _cups = cups.filter(cup => cup.sales > 500)selectS(ul,_cups)}else{selectS(ul,cups)}}</script></body>
</html>

JS22 判断质数

请补全JavaScript代码，要求在Number对象的原型对象上添加"_isPrime"函数，该函数判断调用的对象是否为一个质数，是则返回true，否则返回false。

        <script type="text/javascript">// 补全代码Number.prototype._isPrime = function(number){if(number < 2){return true}for(let i = 2;i <= Math.sqrt(number);i++){if(number % i == 0){return false}}return true}</script>

        <script type="text/javascript">// 补全代码Number.prototype._isPrime = function(){let number = this.valueOf()//let num=Number(this);if(number < 2){return true}for(let i = 2;i<=Math.sqrt(number);i++){if(number % i == 0){return false}}return true}</script>

JS23 验证是否是身份证

请补全JavaScript代码，要求以Boolean的形式返回字符串参数是否符合身份证标准。
注意：
\1. 无需考虑地区信息、出生日期、顺序码与校验码的验证

示例1

输入：_isCard(‘21062319980907888X’)

输出：true

        <script>const _isCard = number => {// 补全代码let reg = /^[\d]{17}[X\d]{1}$/return reg.test(number)}</script>

JS24 Symbol

请补全JavaScript代码，要求以键/值对的对象形式返回参数数组。要求如下：
\1. 键名的数据类型为Symbol
\2. 键值为当前数组项
\3. Symbol的描述为当前数组项
\4. 返回普通对象

        <script type="text/javascript">const _symbolKey = array => {// 补全代码let obj = {}array.forEach(item =>{obj[Symbol(item)] = item;})return obj;}</script>

JS25 相同的Set

请补全JavaScript代码，要求以boolean的形式返回两个Set对象参数是否一样，是则返回true，否则返回false。

        <script>const _isSameSet = (s1, s2) => {// 补全代码return s1 == s1}</script>

return JSON.stringify(s1)==JSON.stringify(s2);

             if (s1.size !== s2.size)return falsefor (const e of s1) {if (!s2.has(e))return false}return true

//通过ES6[...]扩展字符将set对象的伪数组转换为数组再调用every进而判断该数组中的每一项是否存在于另一个set对象中const _isSameSet = (s1, s2) => {// 补全代码if (s1.size !== s2.size) {return false}return [...s1].every(i => s2.has(i))}

JS26 Getter

请补全JavaScript代码，完成名为"Rectangle"的矩形类。要求如下：
\1. 构造函数只包含两个参数，依次为"height"、“width”
\2. 设置Getter，当获取该对象的"area"属性时，返回该对象"height"与"width"属性的乘积

示例1

输入：new Rectangle(12,12).area

输出：144

        <script type="text/javascript">class Rectangle {// 补全代码constructor(height,width){this.height = heightthis.width = width}get area(){return this.height * this.width}}</script>

JS27 控制动画

请补全代码，要求当滑动id为"range"的滑块控件时可以改变id为"rect"的矩形旋转速度。要求如下：
\1. id为"rect"的矩形初始动画周期为10秒
\2. id为"range"的滑块控件默认值为1、最小值为、最大值为10、滑动间隔为1
\3. 当滑动滑块值为1时，矩形动画周期为10秒、当…，为…、当滑动滑块值为10时，矩形动画周期为1秒
注意：
\1. 必须使用DOM0级标准事件（onchange）

<!DOCTYPE html>
<html><head><meta charset=utf-8><style type="text/css">#rect {width: 120px;height: 100px;background-color: black;/*补全代码*/animation: rect 10s linear infinite;}@keyframes rect {from {transform: rotate(0deg);}to {transform: rotate(360deg);}}</style></head><body><!-- 补全代码 --><div id="rect"></div><input id="range" type="range" min="1" max="10" step="1" value="1"/><script type="text/javascript">// 补全代码document.querySelector("#range").onchange = function(){let inputVal = document.querySelector('#range').value;let time = 10 - inputVal + 1;let rect = document.querySelector("#rect");rect.style.animationDuration = time + 's';}</script></body>
</html>

JS28 Map保存节点

请补全JavaScript代码，要求将页面中的"p"标签以键名的形式保存在Map对象中，键名所对应的键值为该"p"标签的文字内容。

<!DOCTYPE html>
<html><head><meta charset=utf-8></head><body><p>1</p><script type="text/javascript">const _elementKey = () => {// 补全代码let key = document.querySelector('p');let value = key.textContent;let m = new Map();m.set(key,value);return m;}</script></body>
</html>

JS29 全选

请补全JavaScript代码，实现以下效果：
\1. 选中"全选"框，以下所有选项全部勾选。
\2. 把"全选"框从选中状态勾选成未选中状态，其他复选框全部取消选中效果。
\3. 当其他复选框全部选中，"全选框"为选中状态。
\4. 当其他复选框有一个未选中，"全选框"取消选中状态。
注意：
\1. 必须使用DOM0级标准事件（onchange）

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"></head><style>ul {list-style: none;}</style><body><ul><li>全选<input type='checkbox' id='all'></li><li>Java<input type='checkbox' class='item'></li><li>javaScript<input type='checkbox' class='item'></li><li>C++<input type='checkbox' class='item'></li><li>python<input type='checkbox' class='item'></li><li>.net<input type='checkbox' class='item'></li></ul><script>// 补全代码var all = document.getElementById("all")//用let不能通过var options = Array.from(document.querySelectorAll(".item"))all.onchange = () => {options.forEach((item) => {item.checked = all.checked})}options.forEach((item) => {item.onchange = function () {let isCheckAll = trueoptions.forEach((item) => {if (!item.checked) {isCheckAll = false}})all.checked = isCheckAll}})</script></body>
</html>

JS30 回文字符串

请补全JavaScript代码，要求以boolean的形式返回参数字符串是否为回文字符串。

        <script type="text/javascript">const _isPalindrome = string => {// 补全代码let left = 0,right = string.length - 1while(left < right){if(string[left++] !== string[right--]){return false}}return true}</script>

        <script type="text/javascript">const _isPalindrome = string => {// 补全代码return string === string.split('').reverse().join('')}</script>

JS31 Proxy计数器

请补全JavaScript代码，请给参数对象添加拦截代理功能，并返回这个代理，要求每当通过代理调用该对象拥有的属性时，"count"值加1，否则减1。

        <script type="text/javascript">let count = 0const _proxy = object => {// 补全代码let proxy = new Proxy(object,{get:function(target,prokey){if(prokey in target){count++}else{count--}}})return proxy}</script>

JS32 Proxy拦截器

请补全JavaScript代码，请给参数对象添加拦截代理功能并返回这个代理。要求如下：
\1. 该函数接收多个参数，首个参数为对象，从第二个参数（包括）往后皆是该对象的属性名
\2. 通过该函数给首个参数对象添加拦截器功能，每当该对象访问到该函数第二个参数（包括）往后的属性时，返回"noright"字符串，表示无权限。

        <script type="text/javascript">const _proxy = (object,...prototypes) => {// 补全代码return new Proxy(object,{get(obj,key){if(prototypes.indexOf(key) > -1)return 'noright'return obj[key]}})}</script>

JS33 监听对象

请补全JavaScript代码，要求如下：
\1. 监听对象属性的变化
\2. 当"person"对象的属性发生变化时，页面中与该属性相关的数据同步更新
注意：
\1. 必须使用Object.defineProperty实现且触发set方法时更新视图
\2. 可以使用预设代码"_render"函数

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"></head><body><style>ul {list-style: none;}</style><ul></ul><script>var ul = document.querySelector('ul');var person = { sex: '男', age: '25', name: '王大锤', height: 28, weight: 32 };const _render = element => {var str = `<li>姓名：<span>${person.name}</span></li><li>性别：<span>${person.sex}</span></li><li>年龄：<span>${person.age}</span></li><li>身高：<span>${person.height}</span></li><li>体重：<span>${person.weight}</span></li>`element.innerHTML = str;}_render(ul);// 补全代码Object.keys(person).forEach(key => {let value = person[key]Object.defineProperty(person,key,{get(){return value},set(newVal){if(newVal != value){value = newVal_render(ul)}}})})</script></body>
</html>

总结

这里对文章进行总结：
以上就是nk前端篇-JS能力测评js的前一部分内容，本文介绍了js相关的一些使用方法，在此记录，更多关于前端题目会后续继续整理。

【前端】nk前端篇-零基础FED
【前端】nk前端篇-CSS布局CSS
【前端】nk前端篇-JS能力测评js(1)
【前端】nk前端篇-JS能力测评js(2)

【前端】nk前端篇-JS能力测评js(1)相关推荐

建议收藏！前端工程师一线大厂面试2021总结篇（50个JS常问知识点）
秋招时节,又有无数投向大厂的简历石沉大海,想进面大厂,到底差在哪里?总结一些前端工程师的学习忠告给大家. 学习前端不要总停留在框架的使用上.唯有系统性地掌握编程思想.设计理念,以及具体的实现方式,方可 ...
ie9无法获取未定义或 null 引用的属性“indexof”_前端JS基础篇（二）JS基本数据类型和引用数据类型及检测数据类型方法...
JS中的数据类型 (一).基本数据类型(值类型) 1.number:数字 -12.12.5.-12.5 0这些数字都是number: js中增加了一个number类型的数据:'NaN' typeof ...
前端之JS篇(一)——计算机基础JS简介
1.计算机基础 1.1 编程语言编程:就是让计算机为解决某个问题而使用某种程序设计语言编写程序代码,并最终得到结果的过程. 计算机程序:就是计算机所执行的一系列的指令集合,而程序全部都是用我们所掌握 ...
前端基础：vue.js跟node.js分别是什么
vue.js和node.js分别是什么?下面本篇文章就来给大家介绍一下vue.js和node.js,希望对大家有所帮助. Vue.js是什么? Vue.js是一款流行的JavaScript前端框架,一 ...
前端面试超全整理1（ js 浏览器安全性能）
1.JS 基础面试题(一) 原始(Primitive)类型涉及面试题:原始类型有哪几种?null 是对象嘛? 在 JS 中,存在着 6 种原始值,分别是: boolean null undefine ...
前端基础知识点整理（html+css+js基础）、不包含框架
css盒子模型盒模型都是由四个部分组成的,分别是margin.border.padding和content. 标准盒模型和IE盒模型的区别在于设置width和height时,所对应的范围不同.标 ...
EasyDSS高性能RTMP、HLS(m3u8)、HTTP-FLV、RTSP流媒体服务器前端源码重构(四)- webpack + video.js 打造流媒体服务器前端
EasyPlayer播放器是基于EasyDSS流媒体服务器视频强大的后台管理能力,提供视频点播和直播播放能力的强大播放载体.流畅稳定的播放性能,集广告植入.数据监测等功能于一身,为开发者提供端到端的一 ...
html修改原生checkbox选中的颜色_[三分钟小文]前端性能优化-HTML、CSS、JS部分
阅读本文您将收获: 性能优化的整体思路在HTML.CSS.JavaScript层级的性能优化为什么要进行性能优化用户: 提升用户体验,改善页面性能开发者: 体现公司意志和开发人员技能性能优化 ...
前端百题斩【006】——js中三类字符串转数字的方式
写该系列文章的初衷是"让每位前端工程师掌握高频知识点,为工作助力".这是前端百题斩的第6斩,希望朋友们关注公众号"执鸢者",用知识武装自己的头脑. js中字符串 ...

【前端】nk前端篇-JS能力测评js(1)