手写面试编程题- 数组去重 深拷贝 获取文本节点 设置奇数偶数背景色 JS中检测变量为string类型的方法 第6题闭包 将两个数组合并为一个数组 怎样添加、移除、移动、复制、创建和查找节点? 继承 对一个数组实现随机排序 让元素水平 垂直居中的三种方式 通过jQuery的extend方法实现深拷贝
第1题==》实现数组去重 通过 new Set(数组名)
// var arr = [12, 12, 3, 4, 5, 4, 5, 6, 6];
// var newarr1 = new Set(arr);
// console.log([...newarr1]);
// 输出的值是 [12, 3, 4, 5, 6]
第2题==》深拷贝:
==》拷贝出来的对象互相的独立,不会影响 使用的JSON.stringify和JSON.parse(user2);
var user1={name:"张三",age:18,sex:"男"};
var user2=JSON.stringify(user1); //用JSON.stringify()把对象转为一个字符串
var user3=JSON.parse(user2); //JSON.parse()会根据这个字符串转为一个新的对象。
console.log(user3);
第3题===>获取 你当前被点击的文本内容
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
$("li").on("click",function(){
console.log($(this).text());
})
on语法是==》父辈的元素对象.on("事件类型","触发的元素",function(){})
第4题==》 设置奇数偶数背景色
odd 奇数 和 even偶数 是可用于匹配下标是奇数或偶数的子元素的关键词(第一个子元素的下标是 1)
li:nth-child(odd) { background: #0f0;} 设置奇数行
计算交集数组
var a = [1,2,3,4,5];
var b = [2,4,6,8,10];
var c = a.filter(function(v){ return b.indexOf(v) > -1 }) //交集
var d = a.filter(function(v){ return b.indexOf(v) == -1 }) //差集
var e = a.filter(function(v){ return !(b.indexOf(v) > -1) }) //补集
.concat(b.filter(function(v){ return !(a.indexOf(v) > -1)}))
//并集
var f = a.concat(b.filter(function(v){ return !(a.indexOf(v) > -1)}));
console.log("a与b的交集:", c); // a与b的交集: (2) [2, 4]
console.log("a与b的差集:", d); // [1, 3, 5]
console.log("a与b的补集:", e); // [1, 3, 5, 6, 8, 10]
console.log("a与b的并集:", f); //(8) [1, 2, 3, 4, 5, 6, 8, 10]
第五题: JS中检测变量为string类型的方法
var aa = "hello world";
function stringCheck (str) {
if(typeof str =="string" || str.constructor == String) {
return true;
} else {
return false;
}
}
console.log(stringCheck(aa)) ;
第6题闭包
// 子函数跨作用域访问了父函数的变量 形成闭包 num不会给释放 。它利用了必报的缺点
var getNum = (function () {
var num = 10;
return function () {
return num++
};
})();
var rst1 = getNum();
var rst2 = getNum();
console.log(rst1, rst2); //10 11
第7题==》 将两个数组合并为一个数组
var a = [1, 2, 3,4,5];
var b = [4, 5, 6];
var c = a.concat(b); //链接
var d=new Set(c); //数组去重
console.log([...d]); //将伪数组变为真实的数组
第8题==》 怎样添加、移除、移动、复制、创建和查找节点?
1)创建新节点
createDocumentFragment() //创建一个DOM片段
createElement() //创建一个具体的元素
createTextNode() //创建一个文本节点
appendChild() //添加
removeChild() //移除
replaceChild() //替换
insertBefore() //插入
3)查找
getElementsByTagName() //通过标签名称
getElementsByName() //通过元素的Name属性的值
getElementById() //通过元素Id,唯一性
第9题==》计算某个
第10题,原型继承提
function Child(name, age){
this.name = name;
this.age = age;
}
Child.prototype = new People();
var child = new Child('Rainy', 20);
child.say()
第11题==》构造函数的继承
function Child(name, age){
People.call(this)
this.name = name;
this.age = age;
}
var child = new Child('Rainy', 20);
child.say();
第12题 ===》对一个数组实现随机排序
var a=[12,34,1,2,3,0,-23]; //对这个数组实现随机排序
function shuffle(arr) {
arr.sort(function () {
return Math.random() - 0.5;
});
}
shuffle(a);
console.log(a);
第13题==》让元素水平 垂直居中的三种方式
/* 第一种方式 绝对定位 距离石中玉为0 最后margin:auto 兼容性:,IE7及之前版本不支持 这种方式的兼容性是最好的了*/
div {
width: 200px;
height: 200px;
background: green;
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
margin: auto;
}
/* 第二种方式 div绝对定位 【margin 负间距】*/
/* div {
width: 200px;
height: 200px;
background: green;
position: absolute;
left: 50%;
top: 50%;
margin-left: -100px;
margin-top: -100px;
} */
/* 第三种方式 用了css3的知识 div绝对定位水平垂直居中【Transforms 变形】 IE8不支持*/
div {
width: 200px;
height: 200px;
background: green;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
第14题===》通过jQuery的extend方法实现深拷贝
var array = [1,2,3,4];
var newArray = $.extend(true,[],array);
手写面试编程题- 数组去重 深拷贝 获取文本节点 设置奇数偶数背景色 JS中检测变量为string类型的方法 第6题闭包 将两个数组合并为一个数组 怎样添加、移除、移动、复制、创建和查找节点? 继承 对一个数组实现随机排序 让元素水平 垂直居中的三种方式 通过jQuery的extend方法实现深拷贝的更多相关文章
- Struts2方法调用的三种方式(有新的!调用方法的说明)
在Struts2中方法调用概括起来主要有三种形式 第一种方式:指定method属性 <action name="heroAction" class="com.ABC ...
- 冒泡排序C#实现,使用委托,包括三种方式:Fun<>,匿名方法,Lambda表达式
冒泡排序是一种简单的排序方法,适合于小量数字排序,对于大量数字(超过10个),还有更高效的排序方法. 这里的实现的冒泡排序,需实现功能: 不仅数字排序,还要对任意对象排序 示例: 对People对象的 ...
- Div水平垂直居中的三种方法
百度了很多种方法,很多是不起作用的.下面这些方法是我亲自试过的.希望对大家有帮助! 下面是一波代码水军. <!DOCTYPE html> <html lang="en&qu ...
- css布局------块元素水平垂直居中的四种方法
HTML <div class="parent answer-1"> <div></div></div> CSS .parent { ...
- JS 中检测数组的四种方法
今天和大家分享一下 JS 中检测是不是数组的四种方法,虽然篇幅不长,不过方法应该算是比较全面了. 1. instanceof 方法 instanceof 用于检测一个对象是不是某个类的实例,数组也是一 ...
- jQuery.extend()方法和jQuery.fn.extend()方法
jQuery.extend()方法和jQuery.fn.extend()方法源码分析 这两个方法用的是相同的代码,一个用于给jQuery对象或者普通对象合并属性和方法一个是针对jQuery对象的实例, ...
- js replace 全局替换 以表单的方式提交参数 判断是否为ie浏览器 将jquery.qqFace.js表情转换成微信的字符码 手机端省市区联动 新字体引用本地运行可以获得,放到服务器上报404 C#提取html中的汉字 MVC几种找不到资源的解决方式 使用Windows服务定时去执行一个方法的三种方式
js replace 全局替换 js 的replace 默认替换只替换第一个匹配的字符,如果字符串有超过两个以上的对应字符就无法进行替换,这时候就要进行一点操作,进行全部替换. <scrip ...
- DOM操作 ——如何添加、移除、移动、复制、创建和查找节点等。
DOM操作 --如何添加.移除.移动.复制.创建和查找节点等. (1)创建新节点 createDocumentFragment() //创建一个DOM片段 createElement() //创建一个 ...
- JS中的DOM操作怎样添加、移除、移动、复制、创建和查找节点
DOM操作怎样添加.移除.移动.复制.创建和查找节点? (1)创建新节点 createDocumentFragment() //创建一个DOM片段 createElement() //创建一个具体的元 ...
随机推荐
- Scrapy的下载中间件
下载中间件 简介 下载器,无法执行js代码,本身不支持代理 下载中间件用来hooks进Scrapy的request/response处理过程的框架,一个轻量级的底层系统,用来全局修改scrapy的re ...
- 【转载】C++:switch红色下划线,Error:控制传输跳过的实例化解决办法
转载链接:https://blog.csdn.net/figoleon/article/details/50072029
- 【转】Cookie和Session和Cache
1 Cookie和Session Cookie和Session都为了用来保存状态信息,都是保存客户端状态的机制,它们都是为了解决HTTP无状态的问题而所做的努力. Session可以用Cookie来实 ...
- 算法设计与分析 1.1 Joyvan的矩阵
★题目描述 Joyvan有一个大小为n * m的矩阵,现在他要对矩阵进行q次操作,操作分为如下三种: 0 x y:交换矩阵的x.y两行. 1 x y:交换矩阵的x.y两列. 2 x y:求当前矩阵第x ...
- 201871010113-刘兴瑞《面向对象程序设计(java)》第八周学习总结
项目 内容 这个作业属于哪个课程 <任课教师博客主页链接> https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 <作业链接地址>htt ...
- acwing 600. 仰视奶牛
题目地址 https://www.acwing.com/problem/content/description/602/ 约翰有N头奶牛,编号为1到N. 现在这N头奶牛按编号从小到大的顺序站成了一排 ...
- Node.js使用Nodemailer发送邮件
除了Python,在node中收发电子邮件也非常简单,因为强大的社区有各种各样的包可以供我么直接使用.Nodemailer包就可以帮助我们快速实现发送邮件的功能. Nodemailer简介 Nodem ...
- go 创建自己的区块
package main import ( "time" "crypto/sha256" "bytes" ) //区块体 type Bloc ...
- 鸟哥的Linux私房菜笔记第五章,文件权限与目录配置(二)
Linux目录配置的依据--FHS 因为利用Linux来开发产品的公司太多,例如,CentOS.Ubuntu.ReHat...,导致了配置文件存放的目录没有统一的标准.后来就有了FHS(Filesys ...
- Java设计模式:Singleton(单例)模式
概念定义 Singleton(单例)模式是指在程序运行期间, 某些类只实例化一次,创建一个全局唯一对象.因此,单例类只能有一个实例,且必须自己创建自己的这个唯一实例,并对外提供访问该实例的方式. 单例 ...